如何使用mapbox麻點
1.注冊賬號獲得access_token.
https://www.mapbox.com
也可使用mapbox網頁上的access_token
2.在網頁中嵌入地圖
頁面結構如下：
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>A simple map</title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.mapbox.com/mapbox.js/v3.0.1/mapbox.js'></script>
<link rel='stylesheet' />
<style>
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }
</style>
</head>
<body>
<!--地圖容器-->
<div id='map'></div>
<script>
L.mapbox.accessToken = '<your access token here>';
var map = L.mapbox.map('map', 'mapbox.streets')
.setView([40, -74.50], 9);
</script>
</body>
</html>
3.實例化maker并添加至地圖
如有多個marker請用foreach添加（數據源一般來源于服務器）
<script>
// L.marker is a low-level marker constructor in Leaflet.
L.marker([37.9, -77], {
icon: L.mapbox.marker.icon({
'marker-size': 'large',
'marker-symbol': 'bus',
'marker-color': '#fa0'
})
}).addTo(map);
</script>
4瘫辩、點擊marker出現彈層
需要用到marker的bindPopup()方法
例子中的popupContent為html
<script>
marker.bindPopup(popupContent).openPopup();
</script>
最后修訂：星期四, 02. 三月 2017 05:14下午
