【Leafletjs】2.添加marker到地图
Leaflet Marker API地址
http://leafletjs.com/reference.html#marker
接着上篇我们在地图中添加一个marker,非常简单只需添加如下代码即可:
var marker = L.marker([30, 118]) .addTo(map);
Demo:http://jsfiddle.net/shitao1988/KDr4B/1/
给这个marker添加一个弹出框
var marker = L.marker([30, 118]) .addTo(map) .bindPopup("<b>中国</b><br>安徽黄山.") .openPopup();
结果如下:
设置Marker相关属性项:
{draggable: true, // 使图标可拖拽 title: ‘Text‘, // 添加一个标题 opacity: 0.5} // 设置透明度 )
Demo:http://jsfiddle.net/shitao1988/KDr4B/2/
下面是marker相关的插件:
1. Leaflet.awesome-markers:提供了丰富多彩的图标
Demo:http://jsfiddle.net/VPzu4/92/
2.Leaflet.markercluster:强大的集聚插件
3.Leaflet.label:美化的label
4.Leaflet.AnimatedMarker:使marker沿线运动
5.leaflet.bouncemarker:加载marker时有个弹跳动画
6.OverlappingMarkerSpiderfier-Leaflet:处理重叠在一起的markers
7.Leaflet.EdgeMarker:在边框上显示不在当前视野中的marker
本人建了一个Leaflet交流群:Leaflet&WebGIS 331437754
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。