added mapquest baselayer option

uses API key registered to https://araidne.geophysik.ruhr-uni-bochum.de/map/
This commit is contained in:
Kasper D. Fischer 2021-10-18 10:58:32 +02:00
parent ecdeaecfde
commit 2e5e998d8a
4 changed files with 72 additions and 54 deletions

View File

@ -1,5 +1,5 @@
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'> <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<!-- r20211017.2 (2021-10-17) --> <!-- Version VVVVV -->
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='de' lang='de'> <html xmlns='http://www.w3.org/1999/xhtml' xml:lang='de' lang='de'>
<head> <head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
@ -36,7 +36,8 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-providers/1.10.1/leaflet-providers.min.js" integrity="sha512-Ifxj89Ujg72gC/psKB9ystryRYiopmDud2EmNTKC9kz192aQwDKVK1FzWsyPc37tgU0UmRQlNnBM++ZnwIXJ9Q==" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-providers/1.10.1/leaflet-providers.min.js" integrity="sha512-Ifxj89Ujg72gC/psKB9ystryRYiopmDud2EmNTKC9kz192aQwDKVK1FzWsyPc37tgU0UmRQlNnBM++ZnwIXJ9Q==" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/leaflet.browser.print@1.0.5/dist/leaflet.browser.print.min.js" integrity="sha256-1MQvHEnVXSKwR+XIVswRSBla/B5ohkp5+HJtritIkgE=" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/leaflet.browser.print@1.0.5/dist/leaflet.browser.print.min.js" integrity="sha256-1MQvHEnVXSKwR+XIVswRSBla/B5ohkp5+HJtritIkgE=" crossorigin="anonymous"></script>
<script src="https://open.mapquestapi.com/sdk/leaflet/v2.2/mq-map.js?key=RPOPuz3lA2GGBtVpEU0ugxtVoGba53Dt"></script> <script src="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-core.js"></script>
<link type="text/css" rel="stylesheet" href="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-core.css"/>
<!-- Map, Events & Stations --> <!-- Map, Events & Stations -->
<script type="text/javascript" src="misc.js"></script> <script type="text/javascript" src="misc.js"></script>

View File

@ -1,5 +1,5 @@
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'> <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<!-- r20211017.2 (2021-10-17) --> <!-- Version VVVVV -->
<html xmlns='http://www.w3.org/1999/xhtml' xml:lang='de' lang='de'> <html xmlns='http://www.w3.org/1999/xhtml' xml:lang='de' lang='de'>
<head> <head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
@ -36,7 +36,8 @@
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-providers/1.10.1/leaflet-providers.min.js" integrity="sha512-Ifxj89Ujg72gC/psKB9ystryRYiopmDud2EmNTKC9kz192aQwDKVK1FzWsyPc37tgU0UmRQlNnBM++ZnwIXJ9Q==" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-providers/1.10.1/leaflet-providers.min.js" integrity="sha512-Ifxj89Ujg72gC/psKB9ystryRYiopmDud2EmNTKC9kz192aQwDKVK1FzWsyPc37tgU0UmRQlNnBM++ZnwIXJ9Q==" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/leaflet.browser.print@1.0.5/dist/leaflet.browser.print.min.js" integrity="sha256-1MQvHEnVXSKwR+XIVswRSBla/B5ohkp5+HJtritIkgE=" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/leaflet.browser.print@1.0.5/dist/leaflet.browser.print.min.js" integrity="sha256-1MQvHEnVXSKwR+XIVswRSBla/B5ohkp5+HJtritIkgE=" crossorigin="anonymous"></script>
<script src="https://open.mapquestapi.com/sdk/leaflet/v2.2/mq-map.js?key=RPOPuz3lA2GGBtVpEU0ugxtVoGba53Dt"></script> <script src="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-core.js"></script>
<link type="text/css" rel="stylesheet" href="https://api.mqcdn.com/sdk/mapquest-js/v1.3.2/mapquest-core.css"/>
<!-- Map, Events & Stations --> <!-- Map, Events & Stations -->
<script type="text/javascript" src="misc.js"></script> <script type="text/javascript" src="misc.js"></script>
@ -156,7 +157,9 @@
<p class="table-caption">Download as <a id="stations-csv-link" href="link" download="stations.csv">CSV file</a>.</p> <p class="table-caption">Download as <a id="stations-csv-link" href="link" download="stations.csv">CSV file</a>.</p>
</div> </div>
<!-- More --> <!-- More -->
<div class="tab" id="moretab"><!--include virtual="more.html.de" --></div> <div class="tab more_de" id="moretab">
<p>Loading text ...</p>
</div>
<!-- Info --> <!-- Info -->
<div class="tab" id="infotab"> <div class="tab" id="infotab">
<div id="infoaccordion"> <div id="infoaccordion">

View File

@ -139,31 +139,38 @@ function initMapLink() {
**********************************************************************/ **********************************************************************/
$(document).ready(function() { $(document).ready(function() {
// create a map in the "map" div, set the view to a given place and zoom if ( config['map']['baselayer'] == 'mapquest' ) {
map = L.map('map', { zoomControl: false, worldCopyJump: true }).setView(config['map']['centerDefault'], config['map']['zoomDefault']); L.mapquest.key = 'RPOPuz3lA2GGBtVpEU0ugxtVoGba53Dt';
map = L.mapquest.map('map', {
layers: L.mapquest.tileLayer('map'),
zoomControl: false, worldCopyJump: true
}).setView(config['map']['centerDefault'], config['map']['zoomDefault']);
} else {
// create a map in the "map" div, set the view to a given place and zoom
map = L.map('map', { zoomControl: false, worldCopyJump: true }).setView(config['map']['centerDefault'], config['map']['zoomDefault']);
// create baselayer // create baselayer
switch ( config['map']['baselayer'] ) { switch ( config['map']['baselayer'] ) {
case 'esrigray': // add ESRI Grayscale World Map (neither city nor road names) case 'esrigray': // add ESRI Grayscale World Map (neither city nor road names)
L.tileLayer.provider('Esri.WorldGrayCanvas').addTo(map); L.tileLayer.provider('Esri.WorldGrayCanvas').addTo(map);
break; break;
case 'aerial': // add ESRI WordImagery tile layer case 'aerial': // add ESRI WordImagery tile layer
L.tileLayer.provider('Esri.WorldImagery').addTo(map); L.tileLayer.provider('Esri.WorldImagery').addTo(map);
break; break;
case 'opentopo': // add OpenTopoMap tile layer case 'opentopo': // add OpenTopoMap tile layer
L.tileLayer.provider('OpenTopoMap').addTo(map); L.tileLayer.provider('OpenTopoMap').addTo(map);
break; break;
case 'mapnik': // add OpenStreetMap.Mapnik tile layer case 'mapnik': // add OpenStreetMap.Mapnik tile layer
L.tileLayer.provider('OpenStreetMap.Mapnik').addTo(map); L.tileLayer.provider('OpenStreetMap.Mapnik').addTo(map);
break; break;
case 'topplus': // add TopPlus tile layer (https://gdz.bkg.bund.de/index.php/default/webdienste/topplus-produkte/wmts-topplusopen-wmts-topplus-open.html) case 'topplus': // add TopPlus tile layer (https://gdz.bkg.bund.de/index.php/default/webdienste/topplus-produkte/wmts-topplusopen-wmts-topplus-open.html)
L.tileLayer('https://sgx.geodatenzentrum.de/wmts_topplus_open/tile/1.0.0/web/default/WEBMERCATOR/{z}/{y}/{x}.png', L.tileLayer('https://sgx.geodatenzentrum.de/wmts_topplus_open/tile/1.0.0/web/default/WEBMERCATOR/{z}/{y}/{x}.png',
{attribution: '&copy; Bundesamt für Kartographie und Geodäsie ('+jahr+'), Datenquellen: <a href="http://sg.geodatenzentrum.de/web_public/Datenquellen_TopPlus_Open.pdf">Geodatenzentrum</a>'}).addTo(map); {attribution: '&copy; Bundesamt für Kartographie und Geodäsie ('+jahr+'), Datenquellen: <a href="http://sg.geodatenzentrum.de/web_public/Datenquellen_TopPlus_Open.pdf">Geodatenzentrum</a>'}).addTo(map);
break; break;
default: // use OpenStreetMap.DE as default default: // use OpenStreetMap.DE as default
L.tileLayer.provider('OpenStreetMap.DE').addTo(map); L.tileLayer.provider('OpenStreetMap.DE').addTo(map);
};
}; };
// add controls // add controls
new L.Control.Zoom({ position: 'topright' }).addTo(map); new L.Control.Zoom({ position: 'topright' }).addTo(map);
new L.control.scale({position: 'bottomright', imperial: false}).addTo(map); new L.control.scale({position: 'bottomright', imperial: false}).addTo(map);

View File

@ -139,30 +139,37 @@ function initMapLink() {
**********************************************************************/ **********************************************************************/
$(document).ready(function() { $(document).ready(function() {
// create a map in the "map" div, set the view to a given place and zoom if ( config['map']['baselayer'] == 'mapquest' ) {
map = L.map('map', { zoomControl: false, worldCopyJump: true }).setView(config['map']['centerDefault'], config['map']['zoomDefault']); L.mapquest.key = 'RPOPuz3lA2GGBtVpEU0ugxtVoGba53Dt';
map = L.mapquest.map('map', {
layers: L.mapquest.tileLayer('map'),
zoomControl: false, worldCopyJump: true
}).setView(config['map']['centerDefault'], config['map']['zoomDefault']);
} else {
// create a map in the "map" div, set the view to a given place and zoom
map = L.map('map', { zoomControl: false, worldCopyJump: true }).setView(config['map']['centerDefault'], config['map']['zoomDefault']);
// create baselayer
// create baselayer switch ( config['map']['baselayer'] ) {
switch ( config['map']['baselayer'] ) { case 'esrigray': // add ESRI Grayscale World Map (neither city nor road names)
case 'esrigray': // add ESRI Grayscale World Map (neither city nor road names) L.tileLayer.provider('Esri.WorldGrayCanvas').addTo(map);
L.tileLayer.provider('Esri.WorldGrayCanvas').addTo(map); break;
break; case 'aerial': // add ESRI WordImagery tile layer
case 'aerial': // add ESRI WordImagery tile layer L.tileLayer.provider('Esri.WorldImagery').addTo(map);
L.tileLayer.provider('Esri.WorldImagery').addTo(map); break;
break; case 'opentopo': // add OpenTopoMap tile layer
case 'opentopo': // add OpenTopoMap tile layer L.tileLayer.provider('OpenTopoMap').addTo(map);
L.tileLayer.provider('OpenTopoMap').addTo(map); break;
break; case 'mapnik': // add OpenStreetMap.Mapnik tile layer
case 'mapnik': // add OpenStreetMap.Mapni tile layer L.tileLayer.provider('OpenStreetMap.Mapnik').addTo(map);
L.tileLayer.provider('OpenStreetMap.Mapnik').addTo(map); break;
break; case 'topplus': // add TopPlus tile layer (https://gdz.bkg.bund.de/index.php/default/webdienste/topplus-produkte/wmts-topplusopen-wmts-topplus-open.html)
case 'topplus': // add TopPlus tile layer (https://gdz.bkg.bund.de/index.php/default/webdienste/topplus-produkte/wmts-topplusopen-wmts-topplus-open.html) L.tileLayer('https://sgx.geodatenzentrum.de/wmts_topplus_open/tile/1.0.0/web/default/WEBMERCATOR/{z}/{y}/{x}.png',
L.tileLayer('https://sgx.geodatenzentrum.de/wmts_topplus_open/tile/1.0.0/web/default/WEBMERCATOR/{z}/{y}/{x}.png', {attribution: '&copy; Federal Agency for Cartography and Geodesy ('+jahr+'), Datasource: <a href="http://sg.geodatenzentrum.de/web_public/Datenquellen_TopPlus_Open.pdf">Geodatenzentrum</a>'}).addTo(map);
{attribution: '&copy; Federal Agency for Cartography and Geodesy ('+jahr+'), Datasource: <a href="http://sg.geodatenzentrum.de/web_public/Datenquellen_TopPlus_Open.pdf">Geodatenzentrum</a>'}).addTo(map); break;
break; default: // use OpenStreetMap.DE as default
default: // use OpenStreetMap.DE as default L.tileLayer.provider('OpenStreetMap.DE').addTo(map);
L.tileLayer.provider('OpenStreetMap.DE').addTo(map); };
}; };
// add controls // add controls
new L.Control.Zoom({ position: 'topright' }).addTo(map); new L.Control.Zoom({ position: 'topright' }).addTo(map);