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

Question

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

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

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

Answer 1

解释你到底在问什么有点困难，但在我看来，你想在 hash portion 时自动打开一个弹出窗口。 location of the current document的匹配地理特征的某些属性。

因此，实例化您的图层，然后使用 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时code>)，它将把 GeoJSON 特征存储为新创建图层的属性，即 layer.feature。
• document.location 的哈希部分是一个始终以 # 开头的字符串。您应该事先清理干净，特别注意URL encoding .