Leaflet：当在一个覆盖物的GeoJSON图层上单击时，地图单击事件无法工作

Question

我正在一个项目中使用Leaflet，并且遇到了一个问题，具体如下：

我已经使用Leaflet实现了地图的点击事件。

map.on('click', function(e) {        
    console.log(e)       
});

一切都运行良好。

我还在地图上添加了一个geojson层。问题是，当我点击覆盖层的geojson层（实际上是一个多边形层）时，地图点击事件不会触发。因此，我的问题是，我应该怎么做才能使地图点击事件在我点击地图上的覆盖层时也能正常工作？

- muzaffar

---

为什么你没有绑定到叠加层？你想要捕捉地图上的点击事件还是特定元素的点击事件？ - snkashis

覆盖层是它自己的对象，与地图对象分开。如果你要将事件绑定到地图对象上，它不会自动转移到覆盖层。根据你想要做什么，你需要将事件绑定到覆盖层而不是/或者同时绑定到地图对象上。 - Kathy

Answer 1

正如评论中所说，click事件绑定到地图或覆盖层，但不会从一个对象冒泡到另一个对象。您必须将其附加到所需的对象。

您可以将单击绑定到整个覆盖层，因为它从L.Evented继承，也可以绑定到单个要素。

要将其绑定到单个要素，请查看教程中的onEachFeature部分。

function onEnachFeature(feature, layer) {
    console.log(feature.properties);
}
L.geoJSON(geojsonFeature, {
    onEachFeature: onEachFeature
}).addTo(map);

根据您想要实现的目标，bindPopup和bindTooltip会很有用。此外，请注意文档中所解释的：

事件被传播到FeatureGroup，因此如果组有事件处理程序，则将处理来自任何图层的事件。这包括鼠标事件和自定义事件。

因此，您可以选择绑定到每个要素或图层，具体取决于您的用例，会产生类似的效果。

- Francisco Puga