传单：加载 geoJSON 文件和特定的 PopUp答案

【问题标题】：Leaflet: Load geoJSON file and specific PopUp传单：加载 geoJSON 文件和特定的 PopUp
【发布时间】：2016-10-04 14:14:16
【问题描述】：

在传单教程 (http://leafletjs.com/examples/geojson/) 中，他们展示了如何将标记或功能与弹出窗口相关联 - 弹出窗口可能包含 HTML 代码。

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

有没有办法关联一个 URL（比如） http://leafletjs.com/examples/geojson/example.html#Coors%40Field 具有特定功能，以便在用户指定 URL 时自动显示？

【问题讨论】：

标签： javascript url popup leaflet

【解决方案1】：

解释您的确切要求有点困难，但在我看来，当location of the current document 的hash portion 与地理特征的某些属性匹配时，您想自动打开一个弹出窗口。

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

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 encoding。

【讨论】：

@KirbyJames 感谢您对 Ivan 的反馈。请注意，感谢人们的 SO 方式也是接受帮助您解决问题的答案。