{"id":7984,"date":"2026-11-02T12:07:11","date_gmt":"2026-11-02T12:07:11","guid":{"rendered":"https:\/\/staging.maptoolkit.com\/api\/raster-tiles-api\/"},"modified":"2026-11-06T15:06:21","modified_gmt":"2026-11-06T15:06:21","slug":"raster-tiles-api","status":"publish","type":"page","link":"https:\/\/staging.maptoolkit.com\/de\/api\/raster-tiles-api\/","title":{"rendered":"Raster Tiles API"},"content":{"rendered":"\n<section class=\"gb-element-e702001c\">\n<div class=\"gb-element-e702001b\">\n<div class=\"gb-element-e702001a\">\n<div class=\"gb-element-e7020019\">\n<span class=\"gb-text gb-text-e7020013\">Raster Tiles API<\/span>\n\n<h1 class=\"gb-text gb-text-e7020014\">Karten, die auf jeder Website laufen<mark style=\"background-color:rgba(0,0,0,0);color:#fa3f38\" class=\"has-inline-color\">.<\/mark><\/h1>\n\n<p class=\"gb-text gb-text-e7020015\">Die Karte kommt als fertige Bilder an. Deshalb l\u00e4dt sie in jedem Browser und funktioniert mit den Kartenwerkzeugen, die die meisten Websites schon nutzen, etwa Leaflet und OpenLayers. Sieben Stile, von der Stadtstra\u00dfe bis zum Wanderweg.<\/p>\n\n<div class=\"gb-element-e7020018\">\n<a class=\"gb-text gb-text-e7020016\" href=\"https:\/\/staging.maptoolkit.com\/de\/demo\/\">Demo buchen<\/a>\n\n<a class=\"gb-text-e7020017\" href=\"https:\/\/docs.maptoolkit.com\/raster-tiles\/\"><span class=\"gb-shape\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/span><span class=\"gb-text\">Zur Dokumentation<\/span><\/a>\n<\/div>\n<\/div>\n\n<figure class=\"gb-element-e7020012\">\n<div class=\"gb-element-e7020010\">\n<div class=\"gb-element-e702000d\" role=\"img\" aria-label=\"Twelve raster tiles of the Hiking style around Hallstatt, zoom level 12\">\n<img fetchpriority=\"high\" class=\"gb-media-e7020001\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2201-1430.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2201-1430.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e7020002\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2202-1430.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2202-1430.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e7020003\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2203-1430.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2203-1430.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e7020004\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2204-1430.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2204-1430.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e7020005\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2201-1431.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2201-1431.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e7020006\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2202-1431.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2202-1431.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e7020007\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2203-1431.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2203-1431.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e7020008\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2204-1431.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2204-1431.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e7020009\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2201-1432.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2201-1432.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e702000a\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2202-1432.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2202-1432.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e702000b\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2203-1432.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2203-1432.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n\n<img class=\"gb-media-e702000c\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2204-1432.webp\" srcset=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/11\/raster-hiking-12-2204-1432.webp 2x\" alt=\"\" width=\"256\" height=\"256\" loading=\"eager\" decoding=\"async\" \/><br>\n<\/div>\n\n<div class=\"gb-element-e702000e\"><\/div>\n\n<div class=\"gb-text gb-text-e702000f\">Ein Tile<\/div>\n<\/div>\n<\/figure>\n<\/div>\n\n<style>.page-id-7984 #footer-widgets{display:none}<\/style>\r\n<\/div>\n<\/section>\n\n<section class=\"gb-element-e702005d\">\n<div class=\"gb-element-e702005c\">\n<div class=\"gb-element-e702005b\">\n<div class=\"gb-element-e702005a\">\n<div class=\"gb-element-e7020058\">\n<span class=\"gb-text gb-text-e7020055\">Raster oder Vektor<\/span>\n\n<h2 class=\"gb-text gb-text-e7020056\">Zwei Wege zu denselben Karten<mark style=\"background-color:rgba(0,0,0,0);color:#fa3f38\" class=\"has-inline-color\">.<\/mark><\/h2>\n\n<p class=\"gb-text gb-text-e7020057\">Beide zeigen dieselben sieben Stile. Sie unterscheiden sich darin, wie die Karte auf den Bildschirm kommt und welche Kartenwerkzeuge sie anzeigen k\u00f6nnen.<\/p>\n<\/div>\n\n<a class=\"gb-text-e7020059\" href=\"https:\/\/staging.maptoolkit.com\/de\/api\/vector-tiles-api\/\"><span class=\"gb-shape\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/span><span class=\"gb-text\">Vector Tiles API<\/span><\/a>\n<\/div>\n\n<div class=\"gb-element-e7020054\">\n<div class=\"gb-element-e7020050\">\n<h3 class=\"gb-text gb-text-e702004e\">Raster Tiles API<\/h3>\n\n<p class=\"gb-text gb-text-e702004f\">Fertige Kartenbilder<\/p>\n\n<ul><li>Die Karte kommt als fertige Bilder an, gezeichnet auf unseren Servern.<\/li><li>Funktioniert mit den Kartenwerkzeugen, die die meisten Websites schon nutzen, etwa Leaflet und OpenLayers.<\/li><li>L\u00e4dt auf jedem Ger\u00e4t und in jedem Browser, auch ohne 3D-Grafikunterst\u00fctzung (WebGL).<\/li><li>Eine flache Karte, von der ganzen Welt bis auf Stra\u00dfenebene (Zoom 1 bis 20).<\/li><li>Die Quellenangabe (Attribution) f\u00fcgen Sie selbst in Ihre Karte ein.<\/li><\/ul>\r\n<\/div>\n\n<div class=\"gb-element-e7020053\">\n<h3 class=\"gb-text gb-text-e7020051\">Vector Tiles API<\/h3>\n\n<p class=\"gb-text gb-text-e7020052\">Kartendaten, im Browser gezeichnet<\/p>\n\n<ul><li>Die Karte kommt als Daten an, und der Browser zeichnet sie.<\/li><li>Braucht eine moderne Kartenbibliothek wie MapLibre GL JS oder Mapbox GL JS.<\/li><li>Fl\u00fcssiges Zoomen, weil der Browser die Karte bei jedem Schritt neu zeichnet.<\/li><li>L\u00e4sst sich drehen, ohne neue Bilder zu laden, und kann Berge in 3D zeigen.<\/li><li>Die Quellenangabe (Attribution) erscheint automatisch.<\/li><\/ul>\r\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n\n<section class=\"gb-element-e702004d\">\n<div class=\"gb-element-e702004c\">\n<div class=\"gb-element-e702004a\">\n<span class=\"gb-text gb-text-e7020047\">Kartenstile<\/span>\n\n<h2 class=\"gb-text gb-text-e7020048\">Sieben Kartenstile f\u00fcr jeden Zweck<mark style=\"background-color:rgba(0,0,0,0);color:#fa3f38\" class=\"has-inline-color\">.<\/mark><\/h2>\n\n<p class=\"gb-text gb-text-e7020049\">Jeden Stil gibt es als Raster Tiles. So k\u00f6nnen Sie zwischen den Stilen wechseln oder Ihren Besuchern mehrere anbieten.<\/p>\n<\/div>\n\n<div class=\"gb-element-e702004b\">\n<div class=\"gb-element-e7020021\">\n<img class=\"gb-media-e702001d\" src=\"https:\/\/staticmap.maptoolkit.net\/?maptype=maptoolkit-maptoolkit.summer&#038;size=320x160&#038;factor=2&#038;format=webp&#038;center=45.985,9.255&#038;zoom=9&#038;api_key=toursprung\" alt=\"Stil Summer: Comer See\" width=\"640\" height=\"320\" loading=\"lazy\" decoding=\"async\" \/><br>\n\n<div class=\"gb-element-e7020020\">\n<h3 class=\"gb-text gb-text-e702001e\">Summer<\/h3>\n\n<p class=\"gb-text gb-text-e702001f\">Outdoorkarte mit schattiertem Gebirgsrelief. Der Standardstil.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e7020026\">\n<img class=\"gb-media-e7020022\" src=\"https:\/\/staticmap.maptoolkit.net\/?maptype=maptoolkit-maptoolkit.winter&#038;size=320x160&#038;factor=2&#038;format=webp&#038;center=47.14,10.245&#038;zoom=12&#038;api_key=toursprung\" alt=\"Stil Winter: St. Anton am Arlberg\" width=\"640\" height=\"320\" loading=\"lazy\" decoding=\"async\" \/><br>\n\n<div class=\"gb-element-e7020025\">\n<h3 class=\"gb-text gb-text-e7020023\">Winter<\/h3>\n\n<p class=\"gb-text gb-text-e7020024\">Winterlicher Look f\u00fcr Schnee- und Skiregionen.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e702002b\">\n<img class=\"gb-media-e7020027\" src=\"https:\/\/staticmap.maptoolkit.net\/?maptype=maptoolkit-maptoolkit.hiking&#038;size=320x160&#038;factor=2&#038;format=webp&#038;center=46.618,12.30&#038;zoom=12.5&#038;api_key=toursprung\" alt=\"Stil Hiking: die Drei Zinnen\" width=\"640\" height=\"320\" loading=\"lazy\" decoding=\"async\" \/><br>\n\n<div class=\"gb-element-e702002a\">\n<h3 class=\"gb-text gb-text-e7020028\">Hiking<\/h3>\n\n<p class=\"gb-text gb-text-e7020029\">Zum Wandern, mit markierten Wegen und ihrer Beschilderung.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e7020030\">\n<img class=\"gb-media-e702002c\" src=\"https:\/\/staticmap.maptoolkit.net\/?maptype=maptoolkit-maptoolkit.cycling&#038;size=320x160&#038;factor=2&#038;format=webp&#038;center=55.683,12.57&#038;zoom=12&#038;api_key=toursprung\" alt=\"Stil Cycling: Kopenhagen\" width=\"640\" height=\"320\" loading=\"lazy\" decoding=\"async\" \/><br>\n\n<div class=\"gb-element-e702002f\">\n<h3 class=\"gb-text gb-text-e702002d\">Cycling<\/h3>\n\n<p class=\"gb-text gb-text-e702002e\">Zum Radfahren, mit Radrouten und Radwegen.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e7020035\">\n<img class=\"gb-media-e7020031\" src=\"https:\/\/staticmap.maptoolkit.net\/?maptype=maptoolkit-maptoolkit.street&#038;size=320x160&#038;factor=2&#038;format=webp&#038;center=48.8535,2.348&#038;zoom=15&#038;api_key=toursprung\" alt=\"Stil Street: Paris\" width=\"640\" height=\"320\" loading=\"lazy\" decoding=\"async\" \/><br>\n\n<div class=\"gb-element-e7020034\">\n<h3 class=\"gb-text gb-text-e7020032\">Street<\/h3>\n\n<p class=\"gb-text gb-text-e7020033\">Detaillierter Stadtplan f\u00fcr St\u00e4dte und Orte.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e702003a\">\n<img class=\"gb-media-e7020036\" src=\"https:\/\/staticmap.maptoolkit.net\/?maptype=maptoolkit-maptoolkit.light&#038;size=320x160&#038;factor=2&#038;format=webp&#038;center=52.370,4.892&#038;zoom=13&#038;api_key=toursprung\" alt=\"Stil Light: Amsterdam\" width=\"640\" height=\"320\" loading=\"lazy\" decoding=\"async\" \/><br>\n\n<div class=\"gb-element-e7020039\">\n<h3 class=\"gb-text gb-text-e7020037\">Light<\/h3>\n\n<p class=\"gb-text gb-text-e7020038\">Hell und ruhig, damit Ihre eigenen Inhalte hervortreten.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e702003f\">\n<img class=\"gb-media-e702003b\" src=\"https:\/\/staticmap.maptoolkit.net\/?maptype=maptoolkit-maptoolkit.dark&#038;size=320x160&#038;factor=2&#038;format=webp&#038;center=40.755,-73.985&#038;zoom=12&#038;api_key=toursprung\" alt=\"Stil Dark: Manhattan\" width=\"640\" height=\"320\" loading=\"lazy\" decoding=\"async\" \/><br>\n\n<div class=\"gb-element-e702003e\">\n<h3 class=\"gb-text gb-text-e702003c\">Dark<\/h3>\n\n<p class=\"gb-text gb-text-e702003d\">Dunkler Stil mit starkem Kontrast.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e7020046\">\n<div class=\"gb-element-e7020041\">\n<span class=\"gb-text gb-text-e7020040\"><svg width=\"28\" height=\"28\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><circle cx=\"13.5\" cy=\"6.5\" r=\".5\" fill=\"currentColor\"\/><circle cx=\"17.5\" cy=\"10.5\" r=\".5\" fill=\"currentColor\"\/><circle cx=\"8.5\" cy=\"7.5\" r=\".5\" fill=\"currentColor\"\/><circle cx=\"6.5\" cy=\"12.5\" r=\".5\" fill=\"currentColor\"\/><path d=\"M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z\"\/><\/svg><\/span>\n<\/div>\n\n<div class=\"gb-element-e7020045\">\n<h3 class=\"gb-text gb-text-e7020042\">Ihr eigener Stil<\/h3>\n\n<p class=\"gb-text gb-text-e7020043\">Eine Karte in Ihren Markenfarben, Teil des Enterprise-Pakets.<\/p>\n\n<a class=\"gb-text-e7020044\" href=\"https:\/\/staging.maptoolkit.com\/de\/solutions\/enterprise\/\"><span class=\"gb-shape\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/span><span class=\"gb-text\">Enterprise<\/span><\/a>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n\n<section class=\"gb-element-e7020096\">\n<div class=\"gb-element-e7020095\">\n<div class=\"gb-element-e702006b\">\n<div class=\"gb-element-e7020068\">\n<div class=\"gb-element-e7020066\">\n<span class=\"gb-text gb-text-e7020063\">F\u00fcr Entwickler<\/span>\n\n<h2 class=\"gb-text gb-text-e7020064\">Eine Webadresse f\u00fcr alle Tiles<mark style=\"background-color:rgba(0,0,0,0);color:#fa3f38\" class=\"has-inline-color\">.<\/mark><\/h2>\n\n<p class=\"gb-text gb-text-e7020065\">F\u00fcgen Sie eine Tile-Adresse in Ihre Kartenbibliothek ein. Die Bibliothek ermittelt dann, welche Bilder sie braucht, und l\u00e4dt sie.<\/p>\n<\/div>\n\n<a class=\"gb-text-e7020067\" href=\"https:\/\/docs.maptoolkit.com\/raster-tiles\/examples\/leaflet\/\"><span class=\"gb-shape\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/span><span class=\"gb-text\">Raster Tiles in Leaflet anzeigen<\/span><\/a>\n<\/div>\n\n<div class=\"gb-element-e702006a\">\n<div class=\"gb-element-e7020062\">\n<div class=\"gb-element-e7020060\">\n<span class=\"gb-text gb-text-e702005e\">Leaflet<\/span>\n\n<span class=\"gb-text gb-text-e702005f\">map.js<\/span>\n<\/div>\n\n<pre class=\"gb-text gb-text-e7020061\">L.tileLayer(<br>  <mark style=\"background-color:rgba(0,0,0,0);color:#fecac7\" class=\"has-inline-color\">&quot;https:\/\/rtc-cdn.maptoolkit.net\/rtc\/&quot;<\/mark><br>    + <mark style=\"background-color:rgba(0,0,0,0);color:#fecac7\" class=\"has-inline-color\">&quot;maptoolkit-maptoolkit.summer\/{z}\/{x}\/{y}{ratio}.png&quot;<\/mark><br>    + <mark style=\"background-color:rgba(0,0,0,0);color:#fecac7\" class=\"has-inline-color\">&quot;?api_key=YOUR_API_KEY&quot;<\/mark>,<br>  { ratio: L.Browser.retina ? <mark style=\"background-color:rgba(0,0,0,0);color:#fecac7\" class=\"has-inline-color\">&quot;@2x&quot;<\/mark> : <mark style=\"background-color:rgba(0,0,0,0);color:#fecac7\" class=\"has-inline-color\">&quot;&quot;<\/mark>,<br>    attribution: <mark style=\"background-color:rgba(0,0,0,0);color:#fecac7\" class=\"has-inline-color\">&quot;\u00a9 Maptoolkit \u00a9 OpenStreetMap&quot;<\/mark> }<br>).addTo(map);<\/pre><br>\n<\/div>\n\n<p class=\"gb-text gb-text-e7020069\">Die Option ratio l\u00e4dt sch\u00e4rfere Tiles auf hochaufl\u00f6senden Bildschirmen.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e7020094\">\n<div class=\"gb-element-e7020070\">\n<span class=\"gb-text gb-text-e702006c\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"m12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83Z\"\/><path d=\"m22 17.65-9.17 4.16a2 2 0 0 1-1.66 0L2 17.65\"\/><path d=\"m22 12.65-9.17 4.16a2 2 0 0 1-1.66 0L2 12.65\"\/><\/svg><\/span>\n\n<div class=\"gb-element-e702006f\">\n<h3 class=\"gb-text gb-text-e702006d\">Passt zu Ihrer Kartenbibliothek<\/h3>\n\n<p class=\"gb-text gb-text-e702006e\">Leaflet, OpenLayers und jede andere Tile-Kartenbibliothek. Die Dokumentation zeigt Leaflet in reinem JavaScript, React, Vue und Angular.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e7020075\">\n<span class=\"gb-text gb-text-e7020071\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><rect width=\"20\" height=\"8\" x=\"2\" y=\"2\" rx=\"2\" ry=\"2\"\/><rect width=\"20\" height=\"8\" x=\"2\" y=\"14\" rx=\"2\" ry=\"2\"\/><line x1=\"6\" x2=\"6.01\" y1=\"6\" y2=\"6\"\/><line x1=\"6\" x2=\"6.01\" y1=\"18\" y2=\"18\"\/><\/svg><\/span>\n\n<div class=\"gb-element-e7020074\">\n<h3 class=\"gb-text gb-text-e7020072\">Keine 3D-Grafik n\u00f6tig<\/h3>\n\n<p class=\"gb-text gb-text-e7020073\">Die Bilder entstehen auf unseren Servern, der Browser braucht also kein WebGL.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e702007a\">\n<span class=\"gb-text gb-text-e7020076\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><rect width=\"18\" height=\"18\" x=\"3\" y=\"3\" rx=\"2\" ry=\"2\"\/><circle cx=\"9\" cy=\"9\" r=\"2\"\/><path d=\"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21\"\/><\/svg><\/span>\n\n<div class=\"gb-element-e7020079\">\n<h3 class=\"gb-text gb-text-e7020077\">G\u00e4ngige Bild-Tiles<\/h3>\n\n<p class=\"gb-text gb-text-e7020078\">PNG-Tiles mit 256 x 256 px im \u00fcblichen XYZ-Schema.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e702007f\">\n<span class=\"gb-text gb-text-e702007b\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M18 8V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h8\"\/><path d=\"M10 19v-3.96 3.15\"\/><path d=\"M7 19h5\"\/><rect width=\"6\" height=\"10\" x=\"16\" y=\"12\" rx=\"2\"\/><\/svg><\/span>\n\n<div class=\"gb-element-e702007e\">\n<h3 class=\"gb-text gb-text-e702007c\">Scharf auf jedem Bildschirm<\/h3>\n\n<p class=\"gb-text gb-text-e702007d\">Mit @2x in der Adresse kommen die Tiles in 512 x 512 px f\u00fcr hochaufl\u00f6sende Bildschirme.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e7020084\">\n<span class=\"gb-text gb-text-e7020080\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><circle cx=\"11\" cy=\"11\" r=\"8\"\/><line x1=\"21\" x2=\"16.65\" y1=\"21\" y2=\"16.65\"\/><line x1=\"11\" x2=\"11\" y1=\"8\" y2=\"14\"\/><line x1=\"8\" x2=\"14\" y1=\"11\" y2=\"11\"\/><\/svg><\/span>\n\n<div class=\"gb-element-e7020083\">\n<h3 class=\"gb-text gb-text-e7020081\">Von der Welt bis zur Stra\u00dfe<\/h3>\n\n<p class=\"gb-text gb-text-e7020082\">Zoomstufen 1 bis 20.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e7020089\">\n<span class=\"gb-text gb-text-e7020085\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><circle cx=\"13.5\" cy=\"6.5\" r=\".5\" fill=\"currentColor\"\/><circle cx=\"17.5\" cy=\"10.5\" r=\".5\" fill=\"currentColor\"\/><circle cx=\"8.5\" cy=\"7.5\" r=\".5\" fill=\"currentColor\"\/><circle cx=\"6.5\" cy=\"12.5\" r=\".5\" fill=\"currentColor\"\/><path d=\"M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z\"\/><\/svg><\/span>\n\n<div class=\"gb-element-e7020088\">\n<h3 class=\"gb-text gb-text-e7020086\">Sieben Stile oder Ihr eigener<\/h3>\n\n<p class=\"gb-text gb-text-e7020087\">Sieben Standardstile. Eigene Stile in Ihren Markenfarben gibt es mit Enterprise.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e702008e\">\n<span class=\"gb-text gb-text-e702008a\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M2.586 17.414A2 2 0 0 0 2 18.828V21a1 1 0 0 0 1 1h3a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h1a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h.172a2 2 0 0 0 1.414-.586l.814-.814a6.5 6.5 0 1 0-4-4z\"\/><circle cx=\"16.5\" cy=\"7.5\" r=\".5\" fill=\"currentColor\"\/><\/svg><\/span>\n\n<div class=\"gb-element-e702008d\">\n<h3 class=\"gb-text gb-text-e702008b\">Ein API-Key<\/h3>\n\n<p class=\"gb-text gb-text-e702008c\">Ihr Key steht in der Tile-Adresse (api_key).<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-element-e7020093\">\n<span class=\"gb-text gb-text-e702008f\"><svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\"><path d=\"M4 22h14a2 2 0 0 0 2-2V7l-5-5H6a2 2 0 0 0-2 2v4\"\/><path d=\"M14 2v4a2 2 0 0 0 2 2h4\"\/><path d=\"m5 12-3 3 3 3\"\/><path d=\"m9 18 3-3-3-3\"\/><\/svg><\/span>\n\n<div class=\"gb-element-e7020092\">\n<h3 class=\"gb-text gb-text-e7020090\">Quellenangabe<\/h3>\n\n<p class=\"gb-text gb-text-e7020091\">Raster Tiles bringen keine eigene Quellenangabe mit, Sie setzen sie daher in Ihrer Karte (attribution).<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n\n<section class=\"gb-element-e70200a9\">\n<div class=\"gb-element-e70200a8\">\n<div class=\"gb-element-e70200a7\">\n<span class=\"gb-text gb-text-e70200a4\">Anwendungsf\u00e4lle<\/span>\n\n<h2 class=\"gb-text gb-text-e70200a5\">Was Sie mit Rasterkarten bauen k\u00f6nnen<mark style=\"background-color:rgba(0,0,0,0);color:#fa3f38\" class=\"has-inline-color\">.<\/mark><\/h2>\n\n<p class=\"gb-text gb-text-e70200a6\">Drei typische Eins\u00e4tze, gezeigt mit echten OpenStreetMap-Daten:<\/p>\n<\/div>\n\n<div class=\"gb-element-e70200a3\">\n<a class=\"gb-element-e702009a\" href=\"https:\/\/staging.maptoolkit.com\/de\/solutions\/tourismus\/\">\n<div class=\"uc-pic\" style=\"aspect-ratio:4\/3;background:#EEF1FB;border-radius:12px;overflow:hidden;padding:6% 6% 0;box-sizing:border-box\"><div style=\"height:100%;background:#FFFFFF;border-radius:8px 8px 0 0;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 10px 30px rgba(25,31,57,0.14)\"><div style=\"display:flex;align-items:center;gap:5px;height:20px;padding:0 9px;background:#F1F2F6;border-bottom:1px solid #E1E2EA;flex:0 0 auto\"><span style=\"width:7px;height:7px;border-radius:50%;background:#F2A19D;display:block\"><\/span><span style=\"width:7px;height:7px;border-radius:50%;background:#F4D38A;display:block\"><\/span><span style=\"width:7px;height:7px;border-radius:50%;background:#A9D8B0;display:block\"><\/span><span style=\"margin-left:8px;height:9px;width:46%;border-radius:5px;background:#FFFFFF;display:block\"><\/span><\/div><div style=\"display:flex;align-items:center;justify-content:space-between;padding:7px 11px;border-bottom:1px solid #EEF0F5;flex:0 0 auto\"><span style=\"font-family:Mulish,sans-serif;font-weight:800;font-size:11px;line-height:1;color:#2A3561\">Bergh\u00fctten<\/span><span style=\"display:flex;gap:6px\"><span style=\"display:block;height:6px;width:22px;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:6px;width:22px;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:6px;width:22px;border-radius:3px;background:#E1E2EA\"><\/span><\/span><\/div><div style=\"display:flex;flex:1;min-height:0\"><div style=\"flex:0 0 36%;border-right:1px solid #EEF0F5;overflow:hidden\"><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:3px;min-width:0\"><span style=\"font-family:Mulish,sans-serif;font-weight:800;font-size:9px;line-height:1.1;color:#191F39;white-space:nowrap;overflow:hidden;text-overflow:ellipsis\">Lucknerh\u00fctte<\/span><span style=\"font-family:Mulish,sans-serif;font-size:8px;line-height:1.1;color:#6B6D7C\">2,241 m<\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:3px;min-width:0\"><span style=\"font-family:Mulish,sans-serif;font-weight:800;font-size:9px;line-height:1.1;color:#191F39;white-space:nowrap;overflow:hidden;text-overflow:ellipsis\">Glorerh\u00fctte<\/span><span style=\"font-family:Mulish,sans-serif;font-size:8px;line-height:1.1;color:#6B6D7C\">2,651 m<\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:3px;min-width:0\"><span style=\"font-family:Mulish,sans-serif;font-weight:800;font-size:9px;line-height:1.1;color:#191F39;white-space:nowrap;overflow:hidden;text-overflow:ellipsis\">St\u00fcdlh\u00fctte<\/span><span style=\"font-family:Mulish,sans-serif;font-size:8px;line-height:1.1;color:#6B6D7C\">2,802 m<\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:3px;min-width:0\"><span style=\"font-family:Mulish,sans-serif;font-weight:800;font-size:9px;line-height:1.1;color:#191F39;white-space:nowrap;overflow:hidden;text-overflow:ellipsis\">Erzherzog-Johann-H\u00fctte<\/span><span style=\"font-family:Mulish,sans-serif;font-size:8px;line-height:1.1;color:#6B6D7C\">3,454 m<\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:3px;min-width:0\"><span style=\"font-family:Mulish,sans-serif;font-weight:800;font-size:9px;line-height:1.1;color:#191F39;white-space:nowrap;overflow:hidden;text-overflow:ellipsis\">Salmh\u00fctte<\/span><span style=\"font-family:Mulish,sans-serif;font-size:8px;line-height:1.1;color:#6B6D7C\">2,644 m<\/span><\/span><\/div><\/div><div style=\"flex:1;min-width:0;position:relative\"><div style=\"position:relative;width:100%;height:100%;overflow:hidden\"><img src=\"https:\/\/staticmap.maptoolkit.net\/?api_key=toursprung&amp;center=47.06,12.708&#038;zoom=11.6&#038;size=208x209&#038;factor=2&#038;format=webp&#038;maptype=maptoolkit-maptoolkit.hiking\" alt=\"Website einer Destination mit einer Liste von Bergh\u00fctten und einer Karte der H\u00fctten rund um den Gro\u00dfglockner\" width=\"760\" height=\"570\" loading=\"lazy\" decoding=\"async\" style=\"position:absolute;top:0;left:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border-radius:0\"\/><svg viewbox=\"0 0 208 209\" preserveaspectratio=\"xMidYMid slice\" aria-hidden=\"true\" font-family=\"Mulish, sans-serif\"><circle cx=\"65\" cy=\"170\" r=\"6\" fill=\"#2A3561\" stroke=\"#FFFFFF\" stroke-width=\"2\"><\/circle><circle cx=\"120\" cy=\"198\" r=\"6\" fill=\"#2A3561\" stroke=\"#FFFFFF\" stroke-width=\"2\"><\/circle><circle cx=\"44\" cy=\"121\" r=\"6\" fill=\"#2A3561\" stroke=\"#FFFFFF\" stroke-width=\"2\"><\/circle><circle cx=\"89\" cy=\"72\" r=\"6\" fill=\"#2A3561\" stroke=\"#FFFFFF\" stroke-width=\"2\"><\/circle><circle cx=\"131\" cy=\"146\" r=\"6\" fill=\"#2A3561\" stroke=\"#FFFFFF\" stroke-width=\"2\"><\/circle><\/svg><\/div><\/div><\/div><\/div><\/div>\r\n\n<div class=\"gb-element-e7020099\">\n<h3 class=\"gb-text gb-text-e7020097\">Destinationen und Outdoor-Websites<span class=\"uc-arrow\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/span><\/h3>\n\n<p class=\"gb-text gb-text-e7020098\">H\u00fctten, Wege und Sehensw\u00fcrdigkeiten auf einer Outdoorkarte, im Kartenwerkzeug, das die Website schon nutzt.<\/p>\n<\/div>\n<\/a>\n\n<a class=\"gb-element-e702009e\" href=\"https:\/\/staging.maptoolkit.com\/de\/solutions\/immobilien\/\">\n<div class=\"uc-pic\" style=\"aspect-ratio:4\/3;background:#EEF1FB;border-radius:12px;overflow:hidden;padding:6% 6% 0;box-sizing:border-box\"><div style=\"height:100%;background:#FFFFFF;border-radius:8px 8px 0 0;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 10px 30px rgba(25,31,57,0.14)\"><div style=\"display:flex;align-items:center;gap:5px;height:20px;padding:0 9px;background:#F1F2F6;border-bottom:1px solid #E1E2EA;flex:0 0 auto\"><span style=\"width:7px;height:7px;border-radius:50%;background:#F2A19D;display:block\"><\/span><span style=\"width:7px;height:7px;border-radius:50%;background:#F4D38A;display:block\"><\/span><span style=\"width:7px;height:7px;border-radius:50%;background:#A9D8B0;display:block\"><\/span><span style=\"margin-left:8px;height:9px;width:46%;border-radius:5px;background:#FFFFFF;display:block\"><\/span><\/div><div style=\"display:flex;align-items:center;justify-content:space-between;padding:7px 11px;border-bottom:1px solid #EEF0F5;flex:0 0 auto\"><span style=\"font-family:Mulish,sans-serif;font-weight:800;font-size:11px;line-height:1;color:#2A3561\">Wohnungen in Wien<\/span><span style=\"display:flex;gap:6px\"><span style=\"display:block;height:6px;width:22px;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:6px;width:22px;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:6px;width:22px;border-radius:3px;background:#E1E2EA\"><\/span><\/span><\/div><div style=\"display:flex;flex:1;min-height:0\"><div style=\"flex:0 0 36%;border-right:1px solid #EEF0F5;overflow:hidden\"><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:3px;min-width:0\"><span style=\"font-family:Mulish,sans-serif;font-weight:800;font-size:9px;line-height:1.1;color:#191F39;white-space:nowrap;overflow:hidden;text-overflow:ellipsis\">Im Umkreis von 300 m<\/span><span style=\"font-family:Mulish,sans-serif;font-size:8px;line-height:1.1;color:#6B6D7C\">Wien, 1. Bezirk<\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:4px;flex:1\"><span style=\"display:block;height:6px;width:70%;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:5px;width:45%;border-radius:3px;background:#EEF0F5\"><\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:4px;flex:1\"><span style=\"display:block;height:6px;width:70%;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:5px;width:45%;border-radius:3px;background:#EEF0F5\"><\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:4px;flex:1\"><span style=\"display:block;height:6px;width:70%;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:5px;width:45%;border-radius:3px;background:#EEF0F5\"><\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:4px;flex:1\"><span style=\"display:block;height:6px;width:70%;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:5px;width:45%;border-radius:3px;background:#EEF0F5\"><\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:4px;flex:1\"><span style=\"display:block;height:6px;width:70%;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:5px;width:45%;border-radius:3px;background:#EEF0F5\"><\/span><\/span><\/div><\/div><div style=\"flex:1;min-width:0;position:relative\"><div style=\"position:relative;width:100%;height:100%;overflow:hidden\"><img src=\"https:\/\/staticmap.maptoolkit.net\/?api_key=toursprung&amp;center=48.2045,16.3665&#038;zoom=14.6&#038;size=208x209&#038;factor=2&#038;format=webp&#038;maptype=maptoolkit-maptoolkit.light\" alt=\"Immobiliensuche mit einer Liste von Wohnungen und einer Karte der Wiener Innenstadt mit einem 300-m-Kreis um die gew\u00e4hlte Wohnung\" width=\"760\" height=\"570\" loading=\"lazy\" decoding=\"async\" style=\"position:absolute;top:0;left:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border-radius:0\"\/><svg viewbox=\"0 0 208 209\" preserveaspectratio=\"xMidYMid slice\" aria-hidden=\"true\" font-family=\"Mulish, sans-serif\"><circle cx=\"104\" cy=\"104\" r=\"71\" fill=\"#2A3561\" fill-opacity=\"0.08\" stroke=\"#2A3561\" stroke-width=\"2\" stroke-dasharray=\"6 5\"><\/circle><g transform=\"translate(104 110) scale(0.75)\"><path d=\"M0 0c-11-16-20-25-20-37a20 20 0 0 1 40 0c0 12-9 21-20 37z\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"3\"><\/path><circle cx=\"0\" cy=\"-37\" r=\"7\" fill=\"#FFFFFF\"><\/circle><\/g><\/svg><\/div><\/div><\/div><\/div><\/div>\r\n\n<div class=\"gb-element-e702009d\">\n<h3 class=\"gb-text gb-text-e702009b\">Immobilien- und Standortsuche<span class=\"uc-arrow\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/span><\/h3>\n\n<p class=\"gb-text gb-text-e702009c\">Eine ruhige Karte unter Ihren Eintr\u00e4gen, mit der Umgebung jedes Orts.<\/p>\n<\/div>\n<\/a>\n\n<a class=\"gb-element-e70200a2\" href=\"https:\/\/staging.maptoolkit.com\/de\/solutions\/startups\/\">\n<div class=\"uc-pic\" style=\"aspect-ratio:4\/3;background:#EEF1FB;border-radius:12px;overflow:hidden;padding:6% 6% 0;box-sizing:border-box\"><div style=\"height:100%;background:#FFFFFF;border-radius:8px 8px 0 0;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 10px 30px rgba(25,31,57,0.14)\"><div style=\"display:flex;align-items:center;gap:5px;height:20px;padding:0 9px;background:#F1F2F6;border-bottom:1px solid #E1E2EA;flex:0 0 auto\"><span style=\"width:7px;height:7px;border-radius:50%;background:#F2A19D;display:block\"><\/span><span style=\"width:7px;height:7px;border-radius:50%;background:#F4D38A;display:block\"><\/span><span style=\"width:7px;height:7px;border-radius:50%;background:#A9D8B0;display:block\"><\/span><span style=\"margin-left:8px;height:9px;width:46%;border-radius:5px;background:#FFFFFF;display:block\"><\/span><\/div><div style=\"display:flex;align-items:center;justify-content:space-between;padding:7px 11px;border-bottom:1px solid #EEF0F5;flex:0 0 auto\"><span style=\"font-family:Mulish,sans-serif;font-weight:800;font-size:11px;line-height:1;color:#2A3561\">Leihrad-Stationen<\/span><span style=\"display:flex;gap:6px\"><span style=\"display:block;height:6px;width:22px;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:6px;width:22px;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:6px;width:22px;border-radius:3px;background:#E1E2EA\"><\/span><\/span><\/div><div style=\"display:flex;flex:1;min-height:0\"><div style=\"flex:0 0 36%;border-right:1px solid #EEF0F5;overflow:hidden\"><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:3px;min-width:0\"><span style=\"font-family:Mulish,sans-serif;font-weight:800;font-size:9px;line-height:1.1;color:#191F39;white-space:nowrap;overflow:hidden;text-overflow:ellipsis\">71 Stationen im Bild<\/span><span style=\"font-family:Mulish,sans-serif;font-size:8px;line-height:1.1;color:#6B6D7C\">Midtown Manhattan<\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:4px;flex:1\"><span style=\"display:block;height:6px;width:70%;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:5px;width:45%;border-radius:3px;background:#EEF0F5\"><\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:4px;flex:1\"><span style=\"display:block;height:6px;width:70%;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:5px;width:45%;border-radius:3px;background:#EEF0F5\"><\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:4px;flex:1\"><span style=\"display:block;height:6px;width:70%;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:5px;width:45%;border-radius:3px;background:#EEF0F5\"><\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:4px;flex:1\"><span style=\"display:block;height:6px;width:70%;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:5px;width:45%;border-radius:3px;background:#EEF0F5\"><\/span><\/span><\/div><div style=\"display:flex;gap:7px;align-items:center;padding:7px 9px;border-bottom:1px solid #F0F1F5\"><span style=\"flex:0 0 26px;height:20px;border-radius:3px;background:#E8ECF8;display:block\"><\/span><span style=\"display:flex;flex-direction:column;gap:4px;flex:1\"><span style=\"display:block;height:6px;width:70%;border-radius:3px;background:#E1E2EA\"><\/span><span style=\"display:block;height:5px;width:45%;border-radius:3px;background:#EEF0F5\"><\/span><\/span><\/div><\/div><div style=\"flex:1;min-width:0;position:relative\"><div style=\"position:relative;width:100%;height:100%;overflow:hidden\"><img src=\"https:\/\/staticmap.maptoolkit.net\/?api_key=toursprung&amp;center=40.758,-73.9855&#038;zoom=13.6&#038;size=208x209&#038;factor=2&#038;format=webp&#038;maptype=maptoolkit-maptoolkit.dark\" alt=\"Web-App mit einer dunklen Karte von Midtown Manhattan und den Leihrad-Stationen aus OpenStreetMap als rote Punkte\" width=\"760\" height=\"570\" loading=\"lazy\" decoding=\"async\" style=\"position:absolute;top:0;left:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;border-radius:0\"\/><svg viewbox=\"0 0 208 209\" preserveaspectratio=\"xMidYMid slice\" aria-hidden=\"true\" font-family=\"Mulish, sans-serif\"><circle cx=\"126\" cy=\"193\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"47\" cy=\"145\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"153\" cy=\"6\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"173\" cy=\"34\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"183\" cy=\"11\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"22\" cy=\"191\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"31\" cy=\"178\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"106\" cy=\"38\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"53\" cy=\"78\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"84\" cy=\"186\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"86\" cy=\"177\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"88\" cy=\"160\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"94\" cy=\"137\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"128\" cy=\"41\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"138\" cy=\"173\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"196\" cy=\"138\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"172\" cy=\"175\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"171\" cy=\"179\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"122\" cy=\"193\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"64\" cy=\"123\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"55\" cy=\"109\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"23\" cy=\"80\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"124\" cy=\"136\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"151\" cy=\"139\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"76\" cy=\"89\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"37\" cy=\"49\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"82\" cy=\"54\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"148\" cy=\"73\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"183\" cy=\"82\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"87\" cy=\"10\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"177\" cy=\"41\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"176\" cy=\"18\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"145\" cy=\"25\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"178\" cy=\"43\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"141\" cy=\"27\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"81\" cy=\"201\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"171\" cy=\"114\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"197\" cy=\"167\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"150\" cy=\"63\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"130\" cy=\"112\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"82\" cy=\"169\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"159\" cy=\"108\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"127\" cy=\"14\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"39\" cy=\"165\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"18\" cy=\"201\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"167\" cy=\"188\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"30\" cy=\"92\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"94\" cy=\"60\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"47\" cy=\"25\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"10\" cy=\"149\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"18\" cy=\"143\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"165\" cy=\"184\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"112\" cy=\"140\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"71\" cy=\"38\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"195\" cy=\"96\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"161\" cy=\"156\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"63\" cy=\"63\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"173\" cy=\"135\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"80\" cy=\"141\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"68\" cy=\"172\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"109\" cy=\"78\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"177\" cy=\"59\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"124\" cy=\"11\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"134\" cy=\"102\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"129\" cy=\"61\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"168\" cy=\"84\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"166\" cy=\"43\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"144\" cy=\"33\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"31\" cy=\"122\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"118\" cy=\"16\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><circle cx=\"147\" cy=\"32\" r=\"3.5\" fill=\"#FA3F38\" stroke=\"#FFFFFF\" stroke-width=\"1.2\"><\/circle><\/svg><\/div><\/div><\/div><\/div><\/div>\r\n\n<div class=\"gb-element-e70200a1\">\n<h3 class=\"gb-text gb-text-e702009f\">Web-Apps und Dashboards<span class=\"uc-arrow\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/span><\/h3>\n\n<p class=\"gb-text gb-text-e70200a0\">Ihre eigenen Daten, etwa Stationen oder Fahrzeuge, auf einer dunklen oder hellen Hintergrundkarte.<\/p>\n<\/div>\n<\/a>\n<\/div>\n<\/div>\n<\/section>\n\n<section class=\"gb-element-fc830000\">\n<div class=\"gb-element-fc830001\">\n<div class=\"gb-element-fc830002\">\n<div class=\"gb-element-fc830003\">\n<span class=\"gb-text gb-text-fc830004\">Fragen und Antworten<\/span>\n\n<h2 class=\"gb-text gb-text-fc830005\">Fragen zu Raster Tiles<mark style=\"background-color:rgba(0,0,0,0);color:#fa3f38\" class=\"has-inline-color\">.<\/mark><\/h2>\n\n<p class=\"gb-text gb-text-fc830006\">Kurze Antworten zu Vektorkarten in Leaflet, Anpassungen der Karte, statischen Bildern und TileJSON.<\/p>\n<\/div>\n\n<div class=\"gb-accordion gb-accordion-fc830007\">\n<div class=\"gb-accordion__item gb-accordion__item-fc830008\">\n<div role=\"button\" tabindex=\"0\" class=\"gb-accordion__toggle gb-accordion__toggle-fc830009\" id=\"gb-accordion-toggle-fc830009\">\n<h3 class=\"gb-text gb-text-fc83000a\">Kann ich stattdessen die Vector Tiles von Maptoolkit in Leaflet nutzen?<\/h3>\n\n\n\n<span class=\"gb-accordion__toggle-icon gb-accordion__toggle-icon-fc83000b\"><span class=\"gb-accordion__toggle-icon-open\"><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg><\/span><span class=\"gb-accordion__toggle-icon-close\"><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m18 15-6-6-6 6\"\/><\/svg><\/span><\/span>\n<\/div>\n\n\n\n<div class=\"gb-accordion__content\" id=\"gb-accordion-content-fc83000c\">\n<p class=\"gb-text gb-text-fc83000d\">Ja. Das Plugin maplibre-gl-leaflet zeichnet die Vektorstile von Maptoolkit in einer gew\u00f6hnlichen 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 \u00e4ndern k\u00f6nnen. Das braucht WebGL und eine zweite Bibliothek. Wenn Sie nichts davon ben\u00f6tigen, sind Raster Tiles die schlankere Wahl.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-accordion__item gb-accordion__item-fc83000e\">\n<div role=\"button\" tabindex=\"0\" class=\"gb-accordion__toggle gb-accordion__toggle-fc83000f\" id=\"gb-accordion-toggle-fc83000f\">\n<h3 class=\"gb-text gb-text-fc830010\">Kann ich die Farben der Rasterkarte \u00e4ndern oder Teile ausblenden?<\/h3>\n\n\n\n<span class=\"gb-accordion__toggle-icon gb-accordion__toggle-icon-fc830011\"><span class=\"gb-accordion__toggle-icon-open\"><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg><\/span><span class=\"gb-accordion__toggle-icon-close\"><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m18 15-6-6-6 6\"\/><\/svg><\/span><\/span>\n<\/div>\n\n\n\n<div class=\"gb-accordion__content\" id=\"gb-accordion-content-fc830012\">\n<p class=\"gb-text gb-text-fc830013\">Nicht im Browser. Raster Tiles sind fertige Bilder, in die Stra\u00dfen und Beschriftungen bereits eingezeichnet sind. Sie k\u00f6nnen sie daher nicht spontan umgestalten, keine Ebenen ausblenden und keine eigenen Daten unter die Beschriftungen legen. Sie k\u00f6nnen zwischen den sieben Standardstilen wechseln, und mit Enterprise erhalten Sie Raster Tiles in einem eigenen Stil f\u00fcr Ihre Marke. Um die Karte selbst im Browser zu \u00e4ndern, nutzen Sie die Vector Tiles API.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-accordion__item gb-accordion__item-fc830014\">\n<div role=\"button\" tabindex=\"0\" class=\"gb-accordion__toggle gb-accordion__toggle-fc830015\" id=\"gb-accordion-toggle-fc830015\">\n<h3 class=\"gb-text gb-text-fc830016\">Wann sollte ich die Static Maps API statt Raster Tiles nutzen?<\/h3>\n\n\n\n<span class=\"gb-accordion__toggle-icon gb-accordion__toggle-icon-fc830017\"><span class=\"gb-accordion__toggle-icon-open\"><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg><\/span><span class=\"gb-accordion__toggle-icon-close\"><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m18 15-6-6-6 6\"\/><\/svg><\/span><\/span>\n<\/div>\n\n\n\n<div class=\"gb-accordion__content\" id=\"gb-accordion-content-fc830018\">\n<p class=\"gb-text gb-text-fc830019\">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\u00fcr interaktive Karten gedacht: Eine Bibliothek wie Leaflet oder OpenLayers l\u00e4dt die Tiles, die beim Verschieben und Zoomen gebraucht werden. Wenn niemand die Karte bewegt, ist ein einzelnes statisches Bild die einfachere Wahl.<\/p>\n<\/div>\n<\/div>\n\n<div class=\"gb-accordion__item gb-accordion__item-fc83001a\">\n<div role=\"button\" tabindex=\"0\" class=\"gb-accordion__toggle gb-accordion__toggle-fc83001b\" id=\"gb-accordion-toggle-fc83001b\">\n<h3 class=\"gb-text gb-text-fc83001c\">Gibt es ein TileJSON f\u00fcr die Rasterstile?<\/h3>\n\n\n\n<span class=\"gb-accordion__toggle-icon gb-accordion__toggle-icon-fc83001d\"><span class=\"gb-accordion__toggle-icon-open\"><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m6 9 6 6 6-6\"\/><\/svg><\/span><span class=\"gb-accordion__toggle-icon-close\"><svg aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m18 15-6-6-6 6\"\/><\/svg><\/span><\/span>\n<\/div>\n\n\n\n<div class=\"gb-accordion__content\" id=\"gb-accordion-content-fc83001e\">\n<p class=\"gb-text gb-text-fc83001f\">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\u00fcr die hochaufl\u00f6sende Version f\u00fcgen Sie @2x vor .json ein. Es enth\u00e4lt die Tile-Adresse, den Zoombereich, die Grenzen und die Tile-Gr\u00f6\u00dfe, sodass Werkzeuge, die TileJSON lesen, die Ebene f\u00fcr Sie einrichten k\u00f6nnen. Wie die Tiles ben\u00f6tigt es Ihren API-Key.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n\n<script type=\"application\/ld+json\">{\"@context\": \"https:\/\/schema.org\", \"@type\": \"FAQPage\", \"mainEntity\": [{\"@type\": \"Question\", \"name\": \"Kann ich stattdessen die Vector Tiles von Maptoolkit in Leaflet nutzen?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"Ja. Das Plugin maplibre-gl-leaflet zeichnet die Vektorstile von Maptoolkit in einer gew\u00f6hnlichen 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 \u00e4ndern k\u00f6nnen. Das braucht WebGL und eine zweite Bibliothek. Wenn Sie nichts davon ben\u00f6tigen, sind Raster Tiles die schlankere Wahl.\"}}, {\"@type\": \"Question\", \"name\": \"Kann ich die Farben der Rasterkarte \u00e4ndern oder Teile ausblenden?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"Nicht im Browser. Raster Tiles sind fertige Bilder, in die Stra\u00dfen und Beschriftungen bereits eingezeichnet sind. Sie k\u00f6nnen sie daher nicht spontan umgestalten, keine Ebenen ausblenden und keine eigenen Daten unter die Beschriftungen legen. Sie k\u00f6nnen zwischen den sieben Standardstilen wechseln, und mit Enterprise erhalten Sie Raster Tiles in einem eigenen Stil f\u00fcr Ihre Marke. Um die Karte selbst im Browser zu \u00e4ndern, nutzen Sie die Vector Tiles API.\"}}, {\"@type\": \"Question\", \"name\": \"Wann sollte ich die Static Maps API statt Raster Tiles nutzen?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"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\u00fcr interaktive Karten gedacht: Eine Bibliothek wie Leaflet oder OpenLayers l\u00e4dt die Tiles, die beim Verschieben und Zoomen gebraucht werden. Wenn niemand die Karte bewegt, ist ein einzelnes statisches Bild die einfachere Wahl.\"}}, {\"@type\": \"Question\", \"name\": \"Gibt es ein TileJSON f\u00fcr die Rasterstile?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"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\u00fcr die hochaufl\u00f6sende Version f\u00fcgen Sie @2x vor .json ein. Es enth\u00e4lt die Tile-Adresse, den Zoombereich, die Grenzen und die Tile-Gr\u00f6\u00dfe, sodass Werkzeuge, die TileJSON lesen, die Ebene f\u00fcr Sie einrichten k\u00f6nnen. Wie die Tiles ben\u00f6tigt es Ihren API-Key.\"}}]}<\/script>\r\n\n<section class=\"gb-element-e70200b2\">\n<img decoding=\"async\" class=\"gb-media-e70200aa\" src=\"https:\/\/staging.maptoolkit.com\/wp-content\/uploads\/2026\/10\/fp-cta-scaled.webp\" alt=\"\" width=\"2560\" height=\"747\" loading=\"lazy\" \/><br>\n\n<div class=\"gb-element-e70200b1\">\n<div class=\"gb-element-e70200ad\">\n<h2 class=\"gb-text gb-text-e70200ab\">Finden Sie die passende Karte f\u00fcr Ihr Projekt<mark style=\"background-color:rgba(0,0,0,0);color:#fa3f38\" class=\"has-inline-color\">.<\/mark><\/h2>\n\n<p class=\"gb-text gb-text-e70200ac\">In einer Demo zeigen wir Ihnen die sieben Stile in Ihrer Region und besprechen, was eine Karte in Ihren eigenen Farben umfassen w\u00fcrde.<\/p>\n<\/div>\n\n<div class=\"gb-element-e70200b0\">\n<a class=\"gb-text gb-text-e70200ae\" href=\"https:\/\/staging.maptoolkit.com\/de\/demo\/\">Demo buchen<\/a>\n\n<a class=\"gb-text-e70200af\" href=\"https:\/\/docs.maptoolkit.com\/raster-tiles\/\"><span class=\"gb-shape\"><svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M13 6l6 6-6 6\"\/><\/svg><\/span><span class=\"gb-text\">Zur Dokumentation<\/span><\/a>\n<\/div>\n<\/div>\n<\/section>\n","protected":false},"excerpt":{"rendered":"<p>Raster Tiles API Karten, die auf jeder Website laufen. Die Karte kommt als fertige Bilder an. Deshalb l\u00e4dt sie in &#8230; <\/p>\n<p class=\"read-more-container\"><a title=\"Raster Tiles API\" class=\"read-more button\" href=\"https:\/\/staging.maptoolkit.com\/de\/api\/raster-tiles-api\/#more-7984\" aria-label=\"Mehr Informationen \u00fcber Raster Tiles API\">Weiterlesen &#8230;<\/a><\/p>\n","protected":false},"author":8,"featured_media":7655,"parent":7833,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-7984","page","type-page","status-publish","has-post-thumbnail"],"_links":{"self":[{"href":"https:\/\/staging.maptoolkit.com\/de\/wp-json\/wp\/v2\/pages\/7984","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/staging.maptoolkit.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/staging.maptoolkit.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/staging.maptoolkit.com\/de\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/staging.maptoolkit.com\/de\/wp-json\/wp\/v2\/comments?post=7984"}],"version-history":[{"count":12,"href":"https:\/\/staging.maptoolkit.com\/de\/wp-json\/wp\/v2\/pages\/7984\/revisions"}],"predecessor-version":[{"id":8735,"href":"https:\/\/staging.maptoolkit.com\/de\/wp-json\/wp\/v2\/pages\/7984\/revisions\/8735"}],"up":[{"embeddable":true,"href":"https:\/\/staging.maptoolkit.com\/de\/wp-json\/wp\/v2\/pages\/7833"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/staging.maptoolkit.com\/de\/wp-json\/wp\/v2\/media\/7655"}],"wp:attachment":[{"href":"https:\/\/staging.maptoolkit.com\/de\/wp-json\/wp\/v2\/media?parent=7984"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}