仅显示视口中具有元素的叠加层

only showing the overlays that have elements in the viewport

如果图层控制对话框仅显示视口中具有元素的叠加层,我会喜欢它。我在这里设置了一个例子来说明我的意思:

https://jsfiddle.net/7e84rh06/2/

因此,在该示例中,“城市”叠加层没有任何元素,但如果您单击“公园”,该叠加层的一个元素就会出现。因此,该叠加层在视口中具有元素,而“城市”叠加层则没有。因此,如果对话框只显示“公园”,我会喜欢它。例如。这个:

...而不是这个:

我也希望它是动态的。例如。如果在缩小时来自其他叠加层的更多元素进入视口,那么我希望在该对话框中显示额外的复选框,如果叠加层的视口中没有元素,那么我希望与该叠加层对应的复选框消失.

这可能吗?

(SO 要求 jsfiddle.net 链接附有代码,因此... token code

根据 Grzgorz T 的评论构建...所有标记都可以分组到 FeatureGroup and then you can call getBounds() on that. Let's save the resultant LatLngBoundsmarkerBounds

然后,您创建一个从 layerControl (layerControl.removeLayer(cities)), calls map.getBounds() and then checks to see if the LatLngBounds returned by getBounds overlaps with bounds from the FeatureGroup. ie. map.getBounds().overlaps(markerBounds). If they do overlap then you readd the overlay. eg. layerControl.addOverlay(cities, 'Cities').

中删除叠加层的函数

然后 运行 这个新函数一次,每次 moveend event 发生时,你都会为 运行 创建一个事件处理程序。例如。 map.on('moveend', function() { callFunc(); });