DE:Erstelle und benutze deine eigene Slippy-Map
Das Einfügen einer "Slippy Map", also eine zoom- und verschiebbare, interaktive Karte, in eine Website ist ein häufiger Weg, OpenStreetMap zu benutzen. Meistens heißt das, dass eine Slippy Map, die Kartenkacheln (Tiles) anzeigt, mit etwas JavaScript-Code in die Website eingefügt wird.
 | Vergiss nicht, OpenStreetMap als Quelle anzugeben. Siehe die Legal FAQ für weitere Details. |
Du kannst unsere bestehende Karte in unsere Website einbetten, so wie auch z.B. eine Google-Karte. Dies kann mit den folgenden JavaScript-Karten-Bibliotheken erfolgen:
- Leaflet (leafletjs.com) ist eine freie und quelloffene JavaScript-Bibliothek mit einer leichtgewichtigen, einfach zu nutzenden API mit vielen Plugins.
- OpenLayers (openlayers.org) ist eine JavaScript-Bibliothek mit großem Funktionsumfang.
- Google Maps Example zeigt, wie man mit der Google Maps API OSM nutzen kann.
Alternativen:
- Jawg Widgets ([1]) sind quelloffene HTML-/JavaScript-Widgets zur nahtlosen Integration von Karten und Diensten (Routen, Geocoding, …).
- Mapsui (github.com/pauldendulk/mapsui) ist eine C#-Karten-Komponente, die mittels BruTile auf Tile-Dienste zugreift.
OSM in ein CMS/Framework einbetten
Man kann OSM in ein Content-Management-System (CMS) einbetten:
| CMS/Framework | Module/Plugin | Hinweis | Quelle | Tutorial | Beispiel mit eingebetteter OSM-Karte |
|---|---|---|---|---|---|
| Joomla | OSModul | Modul basiert auf Leaflet unterstützt Marker | [2] | ||
| Mediawiki | MultiMaps | verwendet Leaflet oder Google Maps API (konfigurierbar) | Wikimedia Gerrit | This wiki! | im Tutorial |
| MediaWiki | Kartographer | verwendet Leaflet | MediaWiki wiki | Wikivoyage | |
| MediaWiki | Maps | verwendet Leaflet | Dokumentation | ||
| Tiki Wiki CMS Groupware | eingebaut | via OpenLayers | |||
| WordPress | OSM WordPress Plugin | unterstützt auch GPX und KML | Download | einfaches Beispiel |
Quelle für Tiles
 | Es wird dringend empfohlen, die Betreiber eines Tile-Diensts vor der Nutzung ihres Diensts zu kontaktieren. Beachte deren Nutzungsbedingungen! |
OpenStreetMap-Tileserver
Typischerweise zeigen die Beispiele, wie man die OpenStreetMap-Tileserver nutzt, die OpenStreetMap Foundation selbst betreibt. Deine Seite liefert den HTML- und ggf. den JavaScript-Code aus, aber die Tiles werden vom Browser von unseren Servern geladen. Du musst dich dabei an die Nutzungsbedingungen der Tileserver der OSMF halten. Der Tile-Dienst wird ohne eine Verfügbarkeits- und Qualitätsgarantie bereitgestellt. Für Websites mit hoher Last sind die spendenfinanzierten OpenStreetMap-Tileserver nicht gedacht. Verwende dafür bitte einen kommerzielles Tile-Dienst.
Alternative Tileserver
Es gibt alternative Tile-Anbieter mit eigenen Nutzungsbedingungen. Viele stellen die OSM-Daten anders dar, da sie einen anderen Kartenstil verwenden, der die OSM-Daten anders in eine Kartengrafik umsetzt.
Eine Liste an Anbietern ist unter Raster tile providers zu finden.
Deine eigenen Tiles
OpenStreetMap ist unbegrenzt flexibel. Du kannst deine eigenen Kartentiles selbst erzeugen, mit der Kartendarstellung, die du wünschst. Weitere Informationen findest du auf Switch2Osm.org.