using modified maps in geoguessr games
当前为
// ==UserScript==
// @name GeoGuessr Custom Maps
// @namespace https://greasyfork.org/users/1179204
// @description using modified maps in geoguessr games
// @version 1.0.3
// @author KaKa
// @license BSD
// @match *://www.geoguessr.com/*
// @require https://update.greasyfork.org/scripts/502813/1423193/Geoguessr%20Tag.js
// @icon https://www.svgrepo.com/show/392367/interaction-interface-layer-layers-location-map.svg
// ==/UserScript==
(function() {
/*=========================================================================Modifiy your guess map here==================================================================================*/
let customOptions={
Language:'en', //en,zh,ja,fr,de,es
Google_StreetView_Layer_Shortcut:'V',
Google_Labels_Layer_Shortcut:'G',
Google_Terrain_Layer_Shortcut:'T',
Google_Satellite_Layer_Shortcut:'B',
OpenWeather_Shortcut:'Q',
OpenWeather_Style:'TA2', //'radar': Global Precipitation; 'CL':Cloud; 'APM':Pressure; 'TA2'Temperature; 'WS10':Wind Speed;
OpenWeather_Date:'now', // format:yyyy-mm-dd, up to one week ago
Bing_Maps_Style:'r', // 'a':satellite(without labels); 'h':hybrid; 'r':roadmap，'sre':terrain
Map_Tiler_Style:'basic', //basic,satellite,bright,landscape,ocean,outdoor,topo,streets,dataviz
Carto_Style:'light_all', //light_all,dark_all
Thunderforest_Style:'spinal-map'} //spinal-map,landscape,outdoors,atlas,transport,
let tileServices=["Google_Maps","OpenStreetMap","Bing_Maps","Map_Tiler","Thunderforest","Carto","Petal_Maps"]
/*======================================================================================================================================================================================*/
let currentMapType='roadmap',currentLayers=[],isGoogleDisplay=true,opacityControl
const openWeatherBaseURL = "https://g.sat.owm.io/vane/2.0/weather";
const radarURL = `https://b.sat.owm.io/maps/2.0/radar/{z}/{x}/{y}?appid=9de243494c0b295cca9337e1e96b00e2&day=${getNow(customOptions.OpenWeather_Date)}`;
const openWeatherURL = (customOptions.OpenWeather_Style === 'radar')
? radarURL
: `${openWeatherBaseURL}/${customOptions.OpenWeather_Style}/{z}/{x}/{y}?appid=9de243494c0b295cca9337e1e96b00e2&&date=${getTimestamp(customOptions.OpenWeather_Date)}&fill_bound=true`;
let tileUrls = {
Petal_Maps: `https://maprastertile-dre.dbankcdn.com/display-service/v1/online-render/getTile/24.07.06.10/{z}/{x}/{y}/?language=${customOptions.Language}&p=46&scale=1&mapType=ROADMAP&presetStyleId=standard&key=CgB6e3x91JxUZ4Ow3JZYVG6r9c9U7rH4ameNQdauHVaVBYGWwy8ueadAtqjs6Yl2z3OwymAEx3JR83vpgPzv4nuC`,
OpenStreetMap: "https://tile.openstreetmap.org/{z}/{x}/{y}.png",
Map_Tiler:`https://api.maptiler.com/maps/${customOptions.Map_Tiler_Style}-v2/256/{z}/{x}/{y}.png?key=0epLOAjD7fw17tghcyee`,
Thunderforest:`https://a.tile.thunderforest.com/${customOptions.Thunderforest_Style}/{z}/{x}/{y}@2x.png?apikey=6a53e8b25d114a5e9216df5bf9b5e9c8`,
Carto:`https://cartodb-basemaps-3.global.ssl.fastly.net/${customOptions.Carto_Style}/{z}/{x}/{y}.png`,
Google_StreetView:"https://www.google.com/maps/vt?pb=!1m7!8m6!1m3!1i{z}!2i{x}!3i{y}!2i9!3x1!2m8!1e2!2ssvv!4m2!1scc!2s*211m3*211e2*212b1*213e2*212b1*214b1!4m2!1ssvl!2s*211b0*212b1!3m8!2sen!3sus!5e1105!12m4!1e68!2m2!1sset!2sRoadmap!4e0!5m4!1e0!8m2!1e1!1e1!6m6!1e12!2i2!11e0!39b0!44e0!50e0",
Google_Labels:`https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i{z}!2i{x}!3i{y}!4i256!2m1!2sm!3m17!2s${customOptions.Language}!3sUS!5e18!12m4!1e68!2m2!1sset!2sRoadmap!12m3!1e37!2m1!1ssmartmaps!12m4!1e26!2m2!1sstyles!2ss.e:g|p.v:off,s.t:1|s.e:g.s|p.v:on,s.e:l|p.v:on!5m1!5f1.5`,
OpenWeather: openWeatherURL
}
let map,google,gsvLayer,initLayer=tag
initCustomizer()
setTimeout(function(){
getMap()
},2000);
function createOpacityControl(controlDiv, layer) {
controlDiv.style.margin='20px'
controlDiv.style.backgroundColor = '#fff';
controlDiv.style.height = '30px';
controlDiv.style.boxShadow = 'rgba(0, 0, 0, 0.3) 0px 1px 4px -1px';
controlDiv.style.borderRadius = '5px';
var opacitySlider = document.createElement('input');
opacitySlider.setAttribute('type', 'range');
opacitySlider.setAttribute('id', 'timeRange');
opacitySlider.setAttribute('min', '0');
opacitySlider.setAttribute('max', '100');
opacitySlider.setAttribute('value', '100');
opacitySlider.setAttribute('step', '1');
opacitySlider.style.width = '100px';
opacitySlider.style.height='20px'
opacitySlider.style.marginTop='5px'
opacitySlider.addEventListener('input', function() {
var opacity = opacitySlider.value / 100
layer.setOpacity(opacity);
});
controlDiv.appendChild(opacitySlider);
}
function addOpacityControl(m, layer) {
var opacityControlDiv = document.createElement('div');
new createOpacityControl(opacityControlDiv, layer);
opacityControl =true
opacityControlDiv.index = 1;
m.controls[google.maps.ControlPosition.TOP_RIGHT].push(opacityControlDiv);
}
function removeOpacityControl(){
if(opacityControl){
map.controls[google.maps.ControlPosition.TOP_RIGHT].removeAt(map.controls[google.maps.ControlPosition.TOP_RIGHT].getLength() - 1)
opacityControl=false
}
}
function getNow(date) {
if(date!='now'){
return date
}
const now = new Date();
now.setHours(now.getHours() - 1);
return now.toISOString().slice(0, 14)+'00';
}
function getTimestamp(date){
var parsedDate
if (date=== 'now') {
parsedDate= new Date()
return Math.floor(parsedDate.getTime() / 1000)
}
parsedDate = new Date(date);
if (isNaN(parsedDate.getTime())) {
throw new Error('Invalid date format');
}
return Math.floor(parsedDate.getTime() / 1000);
}
function extractTileCoordinates(url) {
const regex = /!1i(\d+)!2i(\d+)!3i(\d+)!4i(\d+)/;
const matches = url.match(regex);
if (matches && matches.length === 5) {
const z = matches[1];
const x = matches[2];
const y = matches[3];
return { z, x, y };
} else {
return null;
}
}
function getBingTiles(tileX, tileY, zoom,type) {
var quadKey = tileXYToQuadKey(tileX, tileY, zoom);
var baseUrl = 'https://ecn.t0.tiles.virtualearth.net/tiles/';
return baseUrl + type + quadKey + '.jpeg?g=14519';
}
function tileXYToQuadKey(tileX, tileY, zoom) {
var quadKey = '';
for (var i = zoom; i > 0; i--) {
var digit = 0;
var mask = 1 << (i - 1);
if ((tileX & mask) !== 0) {
digit += 1;
}
if ((tileY & mask) !== 0) {
digit += 2;
}
quadKey += digit.toString();
}
return quadKey;
}
function setMapLayer(layerName) {
var tileLayerUrl = tileUrls[layerName];
var tileLayer
if (layerName==='Bing_Maps') {
tileLayer = new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
return getBingTiles(coord.x,coord.y,zoom,customOptions.Bing_Maps_Style)
.replace('{z}', zoom)
.replace('{x}', coord.x)
.replace('{y}', coord.y);
},
tileSize: new google.maps.Size(256, 256),
name: layerName
});
}
else{
tileLayer = new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
return tileLayerUrl
.replace('{z}', zoom)
.replace('{x}', coord.x)
.replace('{y}', coord.y);
},
tileSize: new google.maps.Size(256, 256),
name: layerName
});
}
if(!layerName.includes('Google')){
isGoogleDisplay=false
}
if(currentLayers.includes(layerName)){
removeMapLayer(layerName)
const index = currentLayers.indexOf(layerName);
if (index !== -1) {
currentLayers.splice(index, 1);
}
if(!layerName.includes(('Google')||('Weather'))){
map.overlayMapTypes.clear();
currentLayers=[]
isGoogleDisplay=true
setMapLayer('Google_Labels')
}
}
else {
map.overlayMapTypes.push(tileLayer)
currentLayers.push(layerName)};
if(layerName==='Google_StreetView'){
if (!opacityControl){
addOpacityControl(map,tileLayer)}
else {
removeOpacityControl()
}
}
}
function removeMapLayer(layerName) {
for (let i = 0; i < map.overlayMapTypes.getLength(); i++) {
const currentLayer = map.overlayMapTypes.getAt(i);
if (currentLayer && currentLayer.name === layerName) {
map.overlayMapTypes.removeAt(i);
break;
}
}
}
function getMap(){
let element = document.getElementsByClassName("guess-map_canvas__cvpqv")[0]
//if (!element) element=document.getElementsByClassName("coordinate-result-map_map__Yh2Il")[0]
const keys = Object.keys(element)
const key = keys.find(key => key.startsWith("__reactFiber$"))
const props = element[key]
map=props.return.return.memoizedProps.map
google=unsafeWindow.google
map.set('styles', [
{
featureType: 'all',
elementType: 'labels',
stylers: [{ visibility: 'off' }]
}
])
setMapLayer('Google_Labels')
}
function setMapType(customType){
if (currentMapType!=customType){
currentMapType=customType
}
else{
currentMapType='roadmap'
}
map.setMapTypeId(currentMapType);
}
function initCustomizer(){
let onKeyDown = (e) => {
if (e.key >= '1' && e.key <= '6') {
e.stopImmediatePropagation();
if(!map) getMap()
const tileIndex=parseInt(e.key)
initLayer(`layer:${tileServices[tileIndex]}`)
map.overlayMapTypes.clear();
currentLayers=[]
removeOpacityControl()
setMapLayer(tileServices[tileIndex])
}
else if (e.key === '0') {
e.stopImmediatePropagation();
if(!map) getMap()
initLayer('layer:Google_Labels')
map.overlayMapTypes.clear();
currentLayers=[]
isGoogleDisplay=true
removeOpacityControl()
setMapLayer('Google_Labels')
}
else if (e.key === customOptions.Google_StreetView_Layer_Shortcut.toLowerCase()|| e.key === customOptions.Google_StreetView_Layer_Shortcut) {
e.stopImmediatePropagation();
if(!map) getMap()
initLayer('layer:Google_StreetView')
if (isGoogleDisplay)setMapLayer('Google_Labels')
setMapLayer('Google_StreetView')
if (isGoogleDisplay)setMapLayer('Google_Labels')
}
else if (e.key === customOptions.Google_Labels_Layer_Shortcut.toLowerCase()|| e.key === customOptions.Google_Labels_Layer_Shortcut) {
e.stopImmediatePropagation();
if(!map) getMap()
initLayer('layer:Google_Labels')
setMapLayer('Google_Labels')
}
else if (e.key === customOptions.Google_Terrain_Layer_Shortcut.toLowerCase()|| e.key === customOptions.Google_Terrain_Layer_Shortcut) {
e.stopImmediatePropagation();
if(!map) getMap()
initLayer('layer:terrain')
setMapType('terrain')
}
else if (e.key === customOptions.Google_Satellite_Layer_Shortcut.toLowerCase()|| e.key === customOptions.Google_Satellite_Layer_Shortcut) {
e.stopImmediatePropagation();
if(!map) getMap()
initLayer('layer:satellite')
setMapType('satellite')
}
else if (e.key === customOptions.OpenWeather_Shortcut.toLowerCase()|| e.key === customOptions.OpenWeather_Shortcut) {
e.stopImmediatePropagation();
if(!map) getMap()
initLayer('layer:weather')
setMapLayer('OpenWeather')
}
}
document.addEventListener("keydown", onKeyDown);
}
})();