mapbox link
This commit is contained in:
parent
7c6a7b0d6b
commit
d00a355d6b
@ -43,7 +43,7 @@
|
|||||||
ACCESS_TOKEN = 'pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw';
|
ACCESS_TOKEN = 'pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw';
|
||||||
MB_ATTR = 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
MB_ATTR = 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>';
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>';
|
||||||
MB_URL = 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=' + ACCESS_TOKEN;
|
MB_URL = 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=' + ACCESS_TOKEN;
|
||||||
OSM_URL = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
|
OSM_URL = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
|
||||||
OSM_ATTRIB = '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors';
|
OSM_ATTRIB = '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors';
|
||||||
|
@ -11,7 +11,7 @@ title: Choropleth Tutorial
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.light'
|
id: 'mapbox.light'
|
||||||
}).addTo(map);
|
}).addTo(map);
|
||||||
|
|
||||||
|
@ -12,7 +12,7 @@ title: Choropleth Tutorial
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.light'
|
id: 'mapbox.light'
|
||||||
}).addTo(map);
|
}).addTo(map);
|
||||||
|
|
||||||
|
@ -42,7 +42,7 @@ css: "#map {
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.light'
|
id: 'mapbox.light'
|
||||||
}).addTo(map);
|
}).addTo(map);
|
||||||
|
|
||||||
|
@ -11,7 +11,7 @@ title: GeoJSON tutorial
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.light'
|
id: 'mapbox.light'
|
||||||
}).addTo(map);
|
}).addTo(map);
|
||||||
|
|
||||||
|
@ -20,7 +20,7 @@
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.light'
|
id: 'mapbox.light'
|
||||||
}).addTo(map);
|
}).addTo(map);
|
||||||
|
|
||||||
|
@ -13,7 +13,7 @@ title: Layers Control Tutorial
|
|||||||
|
|
||||||
var mbAttr = 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
var mbAttr = 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
mbUrl = 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw';
|
mbUrl = 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw';
|
||||||
|
|
||||||
var grayscale = L.tileLayer(mbUrl, {id: 'mapbox.light', attribution: mbAttr}),
|
var grayscale = L.tileLayer(mbUrl, {id: 'mapbox.light', attribution: mbAttr}),
|
||||||
|
@ -17,7 +17,7 @@ css: "body {
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.streets'
|
id: 'mapbox.streets'
|
||||||
}).addTo(map);
|
}).addTo(map);
|
||||||
|
|
||||||
|
@ -34,7 +34,7 @@ We'll now initialize the map in the JavaScript code like we did in the [quick st
|
|||||||
<pre><code class="javascript">var map = L.map('map').fitWorld();
|
<pre><code class="javascript">var map = L.map('map').fitWorld();
|
||||||
|
|
||||||
L.tileLayer('https://api.tiles.mapbox.com/v4/<a href="https://mapbox.com">MapID</a>/997/256/{z}/{x}/{y}.png?access_token={accessToken}', {
|
L.tileLayer('https://api.tiles.mapbox.com/v4/<a href="https://mapbox.com">MapID</a>/997/256/{z}/{x}/{y}.png?access_token={accessToken}', {
|
||||||
attribution: 'Map data &copy; <span class="text-cut" data-cut="[…]"><a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a></span>',
|
attribution: 'Map data &copy; <span class="text-cut" data-cut="[…]"><a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a></span>',
|
||||||
maxZoom: 18
|
maxZoom: 18
|
||||||
}).addTo(map);</code></pre>
|
}).addTo(map);</code></pre>
|
||||||
|
|
||||||
|
@ -12,7 +12,7 @@ customMapContainer: "true"
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.streets'
|
id: 'mapbox.streets'
|
||||||
}).addTo(mymap);
|
}).addTo(mymap);
|
||||||
|
|
||||||
|
@ -12,7 +12,7 @@ customMapContainer: "true"
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.streets'
|
id: 'mapbox.streets'
|
||||||
}).addTo(mymap);
|
}).addTo(mymap);
|
||||||
|
|
||||||
|
@ -12,7 +12,7 @@ customMapContainer: "true"
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.streets'
|
id: 'mapbox.streets'
|
||||||
}).addTo(mymap);
|
}).addTo(mymap);
|
||||||
|
|
||||||
|
@ -12,7 +12,7 @@ customMapContainer: "true"
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.streets'
|
id: 'mapbox.streets'
|
||||||
}).addTo(mymap);
|
}).addTo(mymap);
|
||||||
|
|
||||||
|
@ -53,7 +53,7 @@ Note that `setView` call also returns the map object --- most Leaflet methods ac
|
|||||||
Next we'll add a tile layer to add to our map, in this case it's a Mapbox Streets tile layer. Creating a tile layer usually involves setting the [URL template](/reference.html#url-template) for the tile images, the attribution text and the maximum zoom level of the layer. In this example we'll use the `mapbox.streets` tiles from [Mapbox's "Classic maps"](https://www.mapbox.com/api-documentation/#maps) (in order to use tiles from Mapbox, you must also [request an access token](https://www.mapbox.com/studio/account/tokens/)).
|
Next we'll add a tile layer to add to our map, in this case it's a Mapbox Streets tile layer. Creating a tile layer usually involves setting the [URL template](/reference.html#url-template) for the tile images, the attribution text and the maximum zoom level of the layer. In this example we'll use the `mapbox.streets` tiles from [Mapbox's "Classic maps"](https://www.mapbox.com/api-documentation/#maps) (in order to use tiles from Mapbox, you must also [request an access token](https://www.mapbox.com/studio/account/tokens/)).
|
||||||
|
|
||||||
<pre><code class="javascript">L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
|
<pre><code class="javascript">L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
|
||||||
attribution: 'Map data &copy; <span class="text-cut" data-cut="[…]"><a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a></span>',
|
attribution: 'Map data &copy; <span class="text-cut" data-cut="[…]"><a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a></span>',
|
||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
id: 'mapbox.streets',
|
id: 'mapbox.streets',
|
||||||
accessToken: 'your.mapbox.access.token'
|
accessToken: 'your.mapbox.access.token'
|
||||||
|
@ -9,7 +9,7 @@ title: Video Overlay Tutorial
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.satellite'
|
id: 'mapbox.satellite'
|
||||||
}).addTo(map);
|
}).addTo(map);
|
||||||
|
|
||||||
|
@ -9,7 +9,7 @@ title: Video Overlay Tutorial
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.satellite'
|
id: 'mapbox.satellite'
|
||||||
}).addTo(map);
|
}).addTo(map);
|
||||||
|
|
||||||
|
@ -9,7 +9,7 @@ title: Video Overlay Tutorial
|
|||||||
maxZoom: 18,
|
maxZoom: 18,
|
||||||
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
|
||||||
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
|
||||||
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
|
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
|
||||||
id: 'mapbox.satellite'
|
id: 'mapbox.satellite'
|
||||||
}).addTo(map);
|
}).addTo(map);
|
||||||
|
|
||||||
|
@ -181,7 +181,7 @@ If you have any questions, take a look at the <a href="https://github.com/Leafle
|
|||||||
|
|
||||||
<h2>Getting Involved</h2>
|
<h2>Getting Involved</h2>
|
||||||
|
|
||||||
<p>Let's create the best mapping library that will ever exist! Leaflet is developed by <a href="http://agafonkin.com">Vladimir Agafonkin</a> of <a href="http://mapbox.com">Mapbox</a> with a team of dedicated <a href="https://github.com/Leaflet/Leaflet/graphs/contributors">contributors</a>.
|
<p>Let's create the best mapping library that will ever exist! Leaflet is developed by <a href="http://agafonkin.com">Vladimir Agafonkin</a> of <a href="https://www.mapbox.com/">Mapbox</a> with a team of dedicated <a href="https://github.com/Leaflet/Leaflet/graphs/contributors">contributors</a>.
|
||||||
<a href="https://github.com/Leaflet/Leaflet">Pull requests</a> are always welcome.
|
<a href="https://github.com/Leaflet/Leaflet">Pull requests</a> are always welcome.
|
||||||
However, there are many more ways to get involved with the development of Leaflet.</p>
|
However, there are many more ways to get involved with the development of Leaflet.</p>
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user