Читать книгу Leaflet - Astrid Günther - Страница 29

Thunderforest

Thunderforest bietet Ihnen gleich neun verschiedene Kachelvarianten. Sie erreichen die Kacheln alle über die gleiche URL, lediglich das Unterverzeichnis muss angepasst werden.

Um Kacheln von Thunderforest zu verwenden, müssen Sie ein Zugriffstoken anfordern. Dieses Token können Sie über die Adresse https://www.thunderforest.com/docs/apikeys³² selbst erstellen. Wenn Sie ihre Karte erstellen, hängen Sie dieses Zugriffstoken einfach an das Ende der URL des Tile-Servers an. Zum Beispiel so: https://{s}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png?apikey=YourApiKey

Die Kacheln der OpenCyclemap finden Sie beispielsweise unter der Adresse

https://{s}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png?apikey=YourApiKey

abgelegt. Die Transportvariante finden Sie unter der Adresse

https://{s}.tile.thunderforest.com/transport/{z}/{x}/{y}.png?apikey=YourApiKey.

Nachfolgende Übersicht zeigt Ihnen die verschiedenen Kartenstile von Thunderforest.

Abbildung: pioneer

Abbildung: cycle

Abbildung: transport.

Abbildung: outdoors.

Abbildung: transport-dark.

Abbildung: mobile-atlas.

Abbildung: outdoors.

Abbildung: neighborhood.

Wenn Sie Thunderforest verwenden möchten, müssen Sie unser bisheriges Beispiel nur in einer Zeile abändern. Sie müssen als Tile-Layer nur die im Beispiel zu sehende URL angeben. Der nachfolgende Programmcode zeigt Ihnen ein vollständiges Beispiel.

<!DOCTYPE HTML> <html> <head> <title>Eine OSM-Karte mit Leaflet</title> <link rel="stylesheet" href="../leaflet/leaflet.css" /> <script src="../leaflet/leaflet.js"></script> </head> <body> <div style="height: 700px;" id="mapid"></div> <script> var mymap = L.map('mapid').setView([50.27264, 7.26469], 13); *L.tileLayer('https://{s}.tile.thunderforest.com/landscape/{z}/{x}/{y}.png?apikey=IhrKey') *.addTo(mymap); </script> </body> </html>

Подняться наверх