Leaflet:加载geoJSON文件和特定的PopUp

Question

在Leaflet Tutorials(http://leafletjs.com/examples/geojson/)中,他们展示了如何将标记或特征与弹出窗口相关联 - 它可以包含HTML代码.

我希望用户能够使用URL指定要加载的特定弹出窗口.在Leaflet Tutorial中,URL http://leafletjs.com/examples/geojson/example.html 加载地图和功能 - 但在用户单击功能之前,不会显示任何弹出窗口.

有没有办法将URL(例如)http://leafletjs.com/examples/geojson/example.html#Coors%40Field 与特定功能相关联 ,以便在用户指定URL时自动显示？

Answer 1

解释你究竟要问的内容有点困难,但在我看来,当当前文档的位置的哈希部分与地理特征的某些属性匹配时,你想要自动打开一个弹出窗口.

因此,实例化您的图层,然后遍历您GeoJSON使用的功能L.GeoJSON.eachLayer(),检查名称是否与哈希匹配:

var group = L.geoJSON(geojson, {...}).addTo(map);

group.eachLayer(function(layer) {
    if ('#' + layer.feature.properties.name === document.location.hash) {
        layer.openPopup();
    }
});

要记住几件事:

• 存储对实例的引用,L.GeoJSON以便您可以对其进行操作(调用其eachLayer()方法).
• 当L.GeoJSON实例化一个小叶层(一个L.Marker,L.Polyline或L.Polygon),它将存储以GeoJSON特征为新创建的层的特性,因此layer.feature.
• 哈希部分document.location是一个始终以字符串开头的字符串#.你应该事先清理它,特别注意URL编码.