Filter Leaflet Geojson-Objekt basierend auf Checkbox-Status

Question

Ich habe versucht, diese example anpassen, um eine Broschüre Schicht basierend auf der Checkbox ID zu filtern. Es funktioniert, wo das aktivierte Objekt gefüllt wird und die entsprechende Funktion gefiltert und der Karte hinzugefügt wird.

Wenn ich jedoch das Kontrollkästchen deaktiviert, wird das Box-Objekt leer, aber das Feature bleibt auf der Karte, da nichts zu sagen ist, wenn es entfernt werden soll.

Was muss ich hier tun, um die Funktion zu entfernen?

function update() { 
     var enabled = {}; 
     // Run through each checkbox and record whether it is checked. If it is, 
     // add it to the object of types to display, otherwise do not. 
     for (var i = 0; i < checkboxes.length; i++) { 
      if (checkboxes[i].checked) enabled[checkboxes[i].id] = true; 
     } 
     L.geoJson(parishesData, { 
     filter: function(feature, layer) { 
      return (feature.properties.name in enabled); 
      } 
     }).addTo(map); 
     console.log(enabled) 
     }; 

Answer 1

Jedes Mal, wenn Ihr Skript Ihre update() Funktion ausführt, erstellt es eine neue L.geoJson Gruppe und fügt sich die Karte.

Sie sollten einen Verweis auf diese Gruppe behalten und sie aus der Karte entfernen, bevor Sie der Karte einen neuen hinzufügen.

Wahrscheinlich so etwas wie:

var group; 

function update() { 
    var enabled = {}; 
    // Run through each checkbox and record whether it is checked. If it is, 
    // add it to the object of types to display, otherwise do not. 
    for (var i = 0; i < checkboxes.length; i++) { 
    if (checkboxes[i].checked) enabled[checkboxes[i].id] = true; 
    } 
    if (group) { 
    map.removeLayer(group); 
    } 
    group = L.geoJson(parishesData, { 
    filter: function(feature, layer) { 
     return (feature.properties.name in enabled); 
    } 
    }).addTo(map); 
    console.log(enabled) 
};