传单叠加顺序(点,线和多边形)

问题描述:

我正在使用Leaflet.StyledLayerControl插件,并且希望设置我的图层,以便多边形始终被推到后面,多边形上方的线条和线条上方的点。传单叠加顺序(点,线和多边形)

我已经在这里寻找解决方案,但大多数是指tilelayers或地图窗格(我认为只适用于另一个版本的传单1.0)。

我希望能够打开和关闭线条,并让它们始终低于点(与多边形下面的多段线相同)。

我猜我必须做点什么setZIndexbringToFront()但我不确定从哪里开始。

任何帮助,将不胜感激。谢谢。

简单的解决方案是真的使用小册子1.0,它为您提供map.createPane("paneName")功能。因此,您可以使用它们的pane选项为每个矢量/形状图层指定“polygonsPane”,“linesPane”和“pointsPane”。

设置完成后,您可以将它们添加到地图/从地图中移除它们,并且它们将始终插入到指定的窗格中,因此遵守窗格的顺序。

// Create necessary panes in correct order (i.e. "bottom-most" first). 
map.createPane("polygonsPane"); 
map.createPane("linesPane"); 
map.createPane("pointsPane"); 

L.polygon([/* coords */], { pane: "polygonsPane" }).addTo(map); 
L.polyline([/* coords */], { pane: "linesPane" }).addTo(map); 
L.circleMarker([/* coords */], { pane: "pointsPane" }).addTo(map); 

演示:https://jsfiddle.net/3v7hd2vx/51/

随着单张0.7,你知道所有的矢量层是相同的SVG容器的一部分,添加到地图时被追加,因此它们出现在所有以前添加的顶向量。然后,您必须使用bringToFront()和/或bringToBack()按照您所需的任何顺序对它们进行重新排序。

您可能有兴趣在该案例的帖子中:https://gis.stackexchange.com/questions/166252/geojson-layer-order-in-leaflet-0-7-5/167904#167904

+0

谢谢。我更新到1.0,并得到它的工作。 –

+0

不客气,我很高兴你实现了你的目标! :-)请注意,SO感谢人的方式也是**接受**帮助你的答案。它还告诉社区你的问题已经解决。 – ghybs

+0

好吧,接受!对不起,这是我的第一篇文章,所以我真的不知道该怎么做。 –