Question

我在http://gisdev.clemson.edu/fireflies有一个基于Leaflet.js的网页。右上角是图层的控件。我希望能够从图层的控制框中删除“状态”等选项，但仍然可以保持状态图层的可见性。如果我没有将“状态”对象添加到地图的叠加层，那么该图层就不会在地图上显示。

我曾想过使用jQuery删除选项，但想知道是否有更好的方法 - 在Leaflet框架中内置某种内容。

有什么想法吗？

Answer 1

您可以在地图中添加图层，而无需将其添加到控件中。

查看您的Fireflies应用程序，如果您想要从图层控件中删除状态图层，同时仍然在地图上显示状态图层，只需从叠加层对象中删除状态键/ val。

您已使用以下

将州图层添加到地图中

var wmsstates = L.tileLayer.wms("http://jomdev.clemson.edu:8080/geoserver/it.geosolutions/wms", {
    layers: 'it.geosolutions:USA_States',
    format: 'image/png',
    transparent: true,
    version: '1.1.0',
    attribution: "usastates"
});

wmsstates.addTo(map);

此时它已被添加到地图中。所以现在你所要做的就是不将它添加到图层控件。

所以，而不是这个

var overlays = {    
    "Counties": wmscounty,
    "States": wmsstates,
    "Fireflies": geojsonFirefly
};

layersControl = new L.Control.Layers(baseLayers, overlays, {
    collapsed: false,
    id: 'irfancontrols'
});

使用此

var overlays = {    
    "Counties": wmscounty
    "Fireflies": geojsonFirefly
};

layersControl = new L.Control.Layers(baseLayers, overlays, {
    collapsed: false,
    id: 'irfancontrols'
});

由于States图层不再是叠加层，因此它可能隐藏在底图下方。要解决此问题，您需要致电bringToFront

wmsstates.bringToFront();

很棒的项目BTW。：）

Answer 2

@sfletche的答案有效。或者，我可以通过使用jQuery来完成这项工作。这是我的jQuery解决方案：

$('label').each(function() {
    if ($.trim($(this).text()) == 'States') {//Remove the States
        //$(this).parent().remove();
        $(this).remove();
    }
    if ($.trim($(this).text()) == 'Fireflies') {// Remove the Fireflies
        //$(this).parent().remove();
        $(this).remove();
    }
});

从控制中删除但在地图上保留图层

2 个答案: