向Leaflet点添加点击功能

Question

使用以下代码使用Leaflet将json点添加到地图。

var geojsonLayer = new L.GeoJSON(data, {
    pointToLayer: function (latlng){
        return new L.CircleMarker(latlng, {
            radius: 8,
               fillColor: "#fecb00",
               color: "#fecb00",
               weight: 1,
               opacity: 1,
               fillOpacity: 0.9,
           });

       }

});

我想添加功能，以便点击该点会弹出一个包含geojson文件中更多信息的弹出窗口。这是如何完成的？

Answer 1

假设GeoJson包含一个名为“myProperty”的属性，要在弹出窗口中显示该信息，只需将此指令放在代码之后：

geojsonLayer.on("featureparse", function (e) {
    e.layer.bindPopup("<p>Prop value: " + e.properties.myProperty + "</p>");
});

为GeoJson集合中的每个项目调用“featureparse”事件。它通常用于更具体的数据样式和/或弹出绑定。