Удаление слоев geojson Mapbox.js/Leaflet.js

Question

У меня возникли проблемы с удалением нескольких слоев geojson за раз. Когда я храню их как функциональные слои, есть память о каждом добавленном слое, один за другим. Но когда они становятся маркерными слоями, удаляется только последний щелчок.

Я попытался добавить их в группу и вызвать clearLayers в группе, но это все еще удаляет только последний добавленный слой, а не все. Пробовал также пропустить идентификатор, но это тоже не сработало.

$(function() { 

     var geojson; 

     var map = L.mapbox.map('map') 
      .setView([29.9629, -90.0603], 6); 

     var filters = document.getElementById('filters'); 

     var layerTwo = L.mapbox.featureLayer() 
      .loadURL('panel/data/tamorethan5.geojson') 
      .on('ready', layer) 
     var layerOne = L.mapbox.featureLayer() 
      .loadURL('panel/data/talessthan5.geojson') 
      .on('ready', layer) 
     var layerThree = L.mapbox.featureLayer() 
      .loadURL('panel/data/palessthan5.geojson') 
      .on('ready', layer) 
     var layerFour = L.mapbox.featureLayer() 
      .loadURL('panel/data/pamorethan5.geojson') 
      .on('ready', layer) 

     function layer() { 
      var assetLayerGroup = new L.LayerGroup(); 

      var layer = this 
      var name = layer.getGeoJSON().name; 
      var item = filters.appendChild(document.createElement('div')); 
      var checkbox = item.appendChild(document.createElement('input')); 
      var label = item.appendChild(document.createElement('label')); 
      checkbox.type = 'checkbox'; 
      checkbox.name ='radio'; 
      checkbox.id = 'myCheckbox'; 
      checkbox.value = name; 
      label.innerHTML = name; 
      label.class = label; 
      label.setAttribute('for', name); 
      checkbox.addEventListener('change', update); 

      function update(val) { 
       if (checkbox.checked) { 
       console.log(layer) 
       drawLocations(layer._geojson) 
       } else { 
       newMapLayer.clearLayers(); 

       } 
      } 

      drawLocations = function(layer) { 
       L.stamp(layer) 
       newMapLayer = L.geoJson(layer, { 
        style: style, 
        onEachFeature: onEachFeature, 
        pointToLayer: function(feature, latlng) { 
         var rad = 3; 
         var col = getColor(feature.properties, 'status'); 
         return L.circleMarker(latlng, { 
          radius: rad, 
          fillColor: "#ff7800", 
          stroke: true, 
          weight: 2, 
          opacity: 0.8, 
          fillOpacity: 0.8, 
          className: "circle" 
         }); 
        } 


       }).addTo(map); 

      }; 
     } //end layer 

Answer 1

Хм, ладно - несколько настроек необходимо или рекомендуется здесь:

drawLocations(layer._geojson) 

Все, начиная с подчеркиванием в листовке или MapBox следует рассматривать вне пределов. Вместо этого используйте метод .getGeoJSON.

drawLocations(layer.getGeoJSON()); 

Это не выглядит, как вы на самом деле добавление слоев к assetLayerGroup. Если вы хотите, чтобы сделать это, вы могли бы назвать

var assetLayerGroup = L.layerGroup().addTo(map); 

правой после в

var map = L.mapbox.map('map') 
     .setView([29.9629, -90.0603], 6); 

линии, и вместо вызова .addTo(map) на ваших L.geoJson слоев, вы могли бы назвать .addTo(assetLayerGroup).

Тогда при вызове assetLayerGroup.clearLayers() удалены все добавленные слои.