Mapbox 关闭图层

Question

我有一组 23 个地图框层，可以独立打开和关闭。我想包括一个主 OFF ALL 切换。我怎样才能做到这一点？代码如下：

<script type="text/javascript">
var map = L.map('map',{center: [56.5, -1], minZoom: 7, zoomControl: false, legendControl: true}).setView([56.5, -1], 7);
map.addControl(new L.Control.ZoomMin())
var baseLayer = new L.mapbox.tileLayer('inosys.k52e98ob').addTo(map);
var ui = document.getElementById('map-ui');

var overlays = [
['inosys.k8mg7jp2','Toggle All On', 1], 
['#','Toggle All Off', 1], 
['inosys.jgsk2of8','Significant Discoveries', 999999],
['inosys.gaa3x433','Wells', 999999],
['inosys.gaa3xpkf','Hydrocarbon Fields', 3],
['inosys.u0uttr1z','Field Determinations', 3],
....

Answer 1

在选择“切换”按钮时，您可以运行一个遍历所有层并删除它们的函数，如下所示：

function toggleAllOff(){
  map.eachLayer(function (layer) {
    map.removeLayer(layer);
  });
}

您还可以将所有层添加到单个 LayerGroup，然后在该组上调用 clearLayers，如另一个问题 here 中所述。

编辑： 下面显示了在您的特定情况下工作所需的代码。这个方法删除了基础层，然后我将其重新添加回来，这有点 hacky。如果您不想删除基础层，可以快速检查一下。

link.onclick = function (e) {
    e.preventDefault();
    e.stopPropagation();

//Add the following
    if ($(this).text() == 'Toggle All Off') {
        map.eachLayer(function (layer) {
            map.removeLayer(layer);
        });
        map.addLayer(baseLayer);
    } else if (map.hasLayer(layer)) {

//The rest is your old code
        map.removeLayer(layer);
        map.removeLayer(gridlayer);
        map.removeControl(gridControl);
        map.removeControl(legendControl);
        this.className = '';