Karten, die auf jeder Website laufen.
Die Karte kommt als fertige Bilder an. Deshalb lädt sie in jedem Browser und funktioniert mit den Kartenwerkzeugen, die die meisten Websites schon nutzen, etwa Leaflet und OpenLayers. Sieben Stile, von der Stadtstraße bis zum Wanderweg.
Zwei Wege zu denselben Karten.
Beide zeigen dieselben sieben Stile. Sie unterscheiden sich darin, wie die Karte auf den Bildschirm kommt und welche Kartenwerkzeuge sie anzeigen können.
Raster Tiles API
Fertige Kartenbilder
- Die Karte kommt als fertige Bilder an, gezeichnet auf unseren Servern.
- Funktioniert mit den Kartenwerkzeugen, die die meisten Websites schon nutzen, etwa Leaflet und OpenLayers.
- Lädt auf jedem Gerät und in jedem Browser, auch ohne 3D-Grafikunterstützung (WebGL).
- Eine flache Karte, von der ganzen Welt bis auf Straßenebene (Zoom 1 bis 20).
- Die Quellenangabe (Attribution) fügen Sie selbst in Ihre Karte ein.
Vector Tiles API
Kartendaten, im Browser gezeichnet
- Die Karte kommt als Daten an, und der Browser zeichnet sie.
- Braucht eine moderne Kartenbibliothek wie MapLibre GL JS oder Mapbox GL JS.
- Flüssiges Zoomen, weil der Browser die Karte bei jedem Schritt neu zeichnet.
- Lässt sich drehen, ohne neue Bilder zu laden, und kann Berge in 3D zeigen.
- Die Quellenangabe (Attribution) erscheint automatisch.
Sieben Kartenstile für jeden Zweck.
Jeden Stil gibt es als Raster Tiles. So können Sie zwischen den Stilen wechseln oder Ihren Besuchern mehrere anbieten.
Summer
Outdoorkarte mit schattiertem Gebirgsrelief. Der Standardstil.
Winter
Winterlicher Look für Schnee- und Skiregionen.
Hiking
Zum Wandern, mit markierten Wegen und ihrer Beschilderung.
Cycling
Zum Radfahren, mit Radrouten und Radwegen.
Street
Detaillierter Stadtplan für Städte und Orte.
Light
Hell und ruhig, damit Ihre eigenen Inhalte hervortreten.
Dark
Dunkler Stil mit starkem Kontrast.
Eine Webadresse für alle Tiles.
Fügen Sie eine Tile-Adresse in Ihre Kartenbibliothek ein. Die Bibliothek ermittelt dann, welche Bilder sie braucht, und lädt sie.
L.tileLayer(
"https://rtc-cdn.maptoolkit.net/rtc/"
+ "maptoolkit-maptoolkit.summer/{z}/{x}/{y}{ratio}.png"
+ "?api_key=YOUR_API_KEY",
{ ratio: L.Browser.retina ? "@2x" : "",
attribution: "© Maptoolkit © OpenStreetMap" }
).addTo(map);
Die Option ratio lädt schärfere Tiles auf hochauflösenden Bildschirmen.
Passt zu Ihrer Kartenbibliothek
Leaflet, OpenLayers und jede andere Tile-Kartenbibliothek. Die Dokumentation zeigt Leaflet in reinem JavaScript, React, Vue und Angular.
Keine 3D-Grafik nötig
Die Bilder entstehen auf unseren Servern, der Browser braucht also kein WebGL.
Gängige Bild-Tiles
PNG-Tiles mit 256 x 256 px im üblichen XYZ-Schema.
Scharf auf jedem Bildschirm
Mit @2x in der Adresse kommen die Tiles in 512 x 512 px für hochauflösende Bildschirme.
Von der Welt bis zur Straße
Zoomstufen 1 bis 20.
Sieben Stile oder Ihr eigener
Sieben Standardstile. Eigene Stile in Ihren Markenfarben gibt es mit Enterprise.
Ein API-Key
Ihr Key steht in der Tile-Adresse (api_key).
Quellenangabe
Raster Tiles bringen keine eigene Quellenangabe mit, Sie setzen sie daher in Ihrer Karte (attribution).
Was Sie mit Rasterkarten bauen können.
Drei typische Einsätze, gezeigt mit echten OpenStreetMap-Daten:
Destinationen und Outdoor-Websites
Hütten, Wege und Sehenswürdigkeiten auf einer Outdoorkarte, im Kartenwerkzeug, das die Website schon nutzt.
Immobilien- und Standortsuche
Eine ruhige Karte unter Ihren Einträgen, mit der Umgebung jedes Orts.
Web-Apps und Dashboards
Ihre eigenen Daten, etwa Stationen oder Fahrzeuge, auf einer dunklen oder hellen Hintergrundkarte.
Fragen zu Raster Tiles.
Kurze Antworten zu Vektorkarten in Leaflet, Anpassungen der Karte, statischen Bildern und TileJSON.
Kann ich stattdessen die Vector Tiles von Maptoolkit in Leaflet nutzen?
Ja. Das Plugin maplibre-gl-leaflet zeichnet die Vektorstile von Maptoolkit in einer gewöhnlichen Leaflet-Karte, und Ihre Marker, Popups und Bedienelemente funktionieren weiter. Sie erhalten Beschriftungen in der Sprache Ihrer Leser, eine scharfe Darstellung auf jeder Zoomstufe und einen Stil, den Sie im Browser ändern können. Das braucht WebGL und eine zweite Bibliothek. Wenn Sie nichts davon benötigen, sind Raster Tiles die schlankere Wahl.
Kann ich die Farben der Rasterkarte ändern oder Teile ausblenden?
Nicht im Browser. Raster Tiles sind fertige Bilder, in die Straßen und Beschriftungen bereits eingezeichnet sind. Sie können sie daher nicht spontan umgestalten, keine Ebenen ausblenden und keine eigenen Daten unter die Beschriftungen legen. Sie können zwischen den sieben Standardstilen wechseln, und mit Enterprise erhalten Sie Raster Tiles in einem eigenen Stil für Ihre Marke. Um die Karte selbst im Browser zu ändern, nutzen Sie die Vector Tiles API.
Wann sollte ich die Static Maps API statt Raster Tiles nutzen?
Nutzen Sie die Static Maps API, wenn Sie ein einzelnes fertiges Kartenbild brauchen, etwa in einer E-Mail, einem PDF oder als Vorschaubild. Raster Tiles sind für interaktive Karten gedacht: Eine Bibliothek wie Leaflet oder OpenLayers lädt die Tiles, die beim Verschieben und Zoomen gebraucht werden. Wenn niemand die Karte bewegt, ist ein einzelnes statisches Bild die einfachere Wahl.
Gibt es ein TileJSON für die Rasterstile?
Ja. Jeder Stil hat ein TileJSON-Dokument unter rtc-cdn.maptoolkit.net/rtc/, gefolgt vom Stilnamen und .json, zum Beispiel maptoolkit-maptoolkit.summer.json. Für die hochauflösende Version fügen Sie @2x vor .json ein. Es enthält die Tile-Adresse, den Zoombereich, die Grenzen und die Tile-Größe, sodass Werkzeuge, die TileJSON lesen, die Ebene für Sie einrichten können. Wie die Tiles benötigt es Ihren API-Key.
Finden Sie die passende Karte für Ihr Projekt.
In einer Demo zeigen wir Ihnen die sieben Stile in Ihrer Region und besprechen, was eine Karte in Ihren eigenen Farben umfassen würde.