Mapbox
In den Head Bereich einer HTML Datei muss einfach die CSS- und JS-Files von Mapbox eingefügt werden.
1 <script src='https://api.tiles.mapbox.com/mapbox.js/v2.0.1/mapbox.js'></script>
2 <link href='https://api.tiles.mapbox.com/mapbox.js/v2.0.1/mapbox.css' rel='style\
3 sheet' />
Geojson
Wer Konzepte mit Geodaten macht sollte sich GeoJSON angucken.
Um eine GeoJSON-Datei auszulesen muss man nur den folgenden Code nutzen.
1 <script>
2 L.mapbox.accessToken = 'YOURACCESTOKEN';
3 var map = L.mapbox.map('map', ‚YOURMAPID)
4 .setView([52.5033, 13.3497], 15);
5 var featureLayer = L.mapbox.featureLayer()
6 .loadURL('/data/all_polygons.geojson')
7 .addTo(map);
8 featureLayer.on('ready', function() {
9 // featureLayer.getBounds() returns the corners of the furthest-out markers,
10 // and map.fitBounds() makes sure that the map contains these.
11 map.fitBounds(featureLayer.getBounds());
12 })
13 </script>
Eine GeoJSON Datei ist folgendermaßen aufgebaut:
1 { "type": "Polygon",
2 "coordinates": [
3 [ [100.0, 0.0], [101.0, 0.0], [101.0, 1.0], [100.0, 1.0], [100.0, 0.0] ]
4 ]
5 }
Mehr zu GEOSJON findest du auf geojson.org.