leaflet 地圖上添加marker點擊事件,自定義彈出框

var LeafIcon = L.Icon.extend({
				        options: {
//	 			            shadowUrl: test.png",//陰影圖片,合理利用可以設置效果
				            iconSize:     [60, 64],
				        }
				        });  
var latLng = L.latLng(feature.y, feature.x);  
var icon=new LeafIcon({iconUrl:iconUrl});
var markers= L.marker(latLng,{icon: icon,attributes:feature})
				           .addTo(map)
				           .on('click', function (e) {
//		                     L.popup()
//		                    .setLatLng(e.latlng)
//		                    .setContent(setContent(e))
//		                    .openOn(map);//通過popup添加點擊彈出框
                         //自定義彈框
				          var xset = e.containerPoint.x + 60 + "px";
                          var yset =e.containerPoint.y + "px";
                          $("#tstDiv").css({"left": xset, "top": yset, "z-index": '1000'});
                          $("#tstDiv").append(setContent(e));
                          $("#tstDiv").show();
                           });	//添加marker來設置點擊事件


//二、通過L.geoJSON來添加marker或者line
resultLayer=L.geoJSON();
  resultLayer.addLayer(L.marker(latLng, {icon: icon,attributes:feature}).addTo(map).bindTooltip(feature.name+": "+feature.code, {
			               offset: L.point([0, -10]),//10, -60
				               direction: "top",
				               permanent: true
   			            })).openTooltip();//添加marker後直接打開標籤
// 添加點擊事件
 resultLayer.addLayer(L.marker(latLng, {icon: icon,attributes:feature}));
 var popup = L.popup().setContent(html);
 resultLayer.addTo(map).bindPopup(popup);

 

發佈了31 篇原創文章 · 獲贊 4 · 訪問量 1萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章