在我的传单应用程序中，我同时使用画布和SVG渲染器。画布渲染器用于标记，SVG用于多边形。但正因为如此，我无法使用layer.bringToBack()方法命令SVG渲染多边形层。我希望多边形层后退的原因如下图所示。标记上方的面
layer.bringToBack()
多边形覆盖了我的标记，使他们不可点击，我希望多边形低于我的标记作为foll图像。标记下方的面
在html中，这是层的排列方式，所有的canvas和html元素。HTML代码
请为我的问题建议一个合适的解决方案
tjrkku2a1#
您可以创建新的Map窗格并将标记添加到该窗格：www.example.comhttps://leafletjs.com/reference.html#map-pane
map.createPane('canvasMarkers'); //https://leafletjs.com/reference.html#map-createpane var canvas = L.canvas({ pane: 'canvasMarkers' }) L.circleMarker(map.getCenter(), {renderer: canvas}).addTo(map);
.leaflet-canvasMarkers-pane{ z-index: 600; }
或仅使用图像标记窗格：
var canvas = L.canvas({ pane: 'markerPane' }) L.circleMarker(map.getCenter(), {renderer: canvas}).addTo(map);
https://plnkr.co/edit/gVuJvUw7mCVNa6Xj
1条答案
按热度按时间tjrkku2a1#
您可以创建新的Map窗格并将标记添加到该窗格：www.example.comhttps://leafletjs.com/reference.html#map-pane
或仅使用图像标记窗格：
https://plnkr.co/edit/gVuJvUw7mCVNa6Xj