leaflet的基础知识
1. divIcon自定义图标
var myIcon = L.divIcon({className: 'my-div-icon'});
L.marker([50.505, 30.57], {icon: myIcon}).addTo(map);
2.featureGroup 创建一个特征组,可选择给定一组初始层和一个options对象
L.featureGroup([marker1, marker2, polyline])
.bindPopup('Hello world!')
.on('click', function() { alert('Clicked on a member of the group!'); })
.addTo(map);
3.geoJSON 表示一个 GeoJSON 对象或一组 GeoJSON 对象。允许您解析 GeoJSON 数据并将其显示在地图上
L.geoJSON(data, {
style: function (feature) {
return {color: feature.properties.color};
}
}).bindPopup(function (layer) {
return layer.feature.properties.description;
}).addTo(map);
4.map 在给定
元素的 DOM ID 和可选的对象字面量的情况下实例化地图对象Map options。
var map = L.map('map', {
center: [51.505, -0.09],
zoom: 13
});
5.marker 用于在地图上显示可点击/可拖动的图标
L.marker([50.5, 30.5]).addTo(map);
6.polyline 在给定地理点数组和可选的选项对象的情况下实例化折线对象。您可以通过传递地理点数组来创建Polyline具有多条单独线 ( ) 的对象。
var latlngs = [
[45.51, -122.68],
[37.77, -122.43],
[34.04, -118.2]
];
var polyline = L.polyline(latlngs, {color: 'red'}).addTo(map);
map.fitBounds(polyline.getBounds());