传单 z-index
Leaflet z-index
我正在将一些 Google 地图代码移植到 Leaflet(好吧,实际上是 Mapbox)。我在地图上有很多形状(如矩形、多边形)和标记,我需要能够随时手动调整它们的顺序,而不仅仅是在第一次添加它们时。
在 google 地图中有一个 setZIndex
方法允许调整窗格内元素的顺序(形状总是在标记下方)。我怎样才能在传单中做到这一点?如果它在 api 中不可用,实现它的最佳方法是什么?
看看 zIndexOffset
,Marker class 中的一个选项。
您可以将函数绑定到 layeradd
事件以单独设置每个标记的样式。
myLayer.on('layeradd', function (e) {
var marker = e.layer;
var zindex = 0;
var feature = marker.feature;
if (feature.geometry.type == 'Point') {
marker.setStyle({
'zIndexOffset': 3
}
});
});
目前在传单中不可用 API。幸运的是,如果 Leaflet 使用 SVG,所有对象都是 DOM 元素,我们可以简单地改变它们的顺序。这是示例代码:
L.Path.prototype.setZIndex = function (index)
{
var obj = $(this._container || this._path);
if (!obj.length) return; // not supported on canvas
var parent = obj.parent();
obj.data('order', index).detach();
var lower = parent.children().filter(function ()
{
var order = $(this).data('order');
if (order == undefined) return false;
return order <= index;
});
if (lower.length)
{
lower.last().after(obj);
}
else
{
parent.prepend(obj);
}
};
Leaflet 默认将形状 ("overlays") 和标记放在不同的窗格中,具有不同的 z-index
值:
我正在将一些 Google 地图代码移植到 Leaflet(好吧,实际上是 Mapbox)。我在地图上有很多形状(如矩形、多边形)和标记,我需要能够随时手动调整它们的顺序,而不仅仅是在第一次添加它们时。
在 google 地图中有一个 setZIndex
方法允许调整窗格内元素的顺序(形状总是在标记下方)。我怎样才能在传单中做到这一点?如果它在 api 中不可用,实现它的最佳方法是什么?
看看 zIndexOffset
,Marker class 中的一个选项。
您可以将函数绑定到 layeradd
事件以单独设置每个标记的样式。
myLayer.on('layeradd', function (e) {
var marker = e.layer;
var zindex = 0;
var feature = marker.feature;
if (feature.geometry.type == 'Point') {
marker.setStyle({
'zIndexOffset': 3
}
});
});
目前在传单中不可用 API。幸运的是,如果 Leaflet 使用 SVG,所有对象都是 DOM 元素,我们可以简单地改变它们的顺序。这是示例代码:
L.Path.prototype.setZIndex = function (index)
{
var obj = $(this._container || this._path);
if (!obj.length) return; // not supported on canvas
var parent = obj.parent();
obj.data('order', index).detach();
var lower = parent.children().filter(function ()
{
var order = $(this).data('order');
if (order == undefined) return false;
return order <= index;
});
if (lower.length)
{
lower.last().after(obj);
}
else
{
parent.prepend(obj);
}
};
Leaflet 默认将形状 ("overlays") 和标记放在不同的窗格中,具有不同的 z-index
值: