Leaflet.js: Cómo eliminar múltiples capas del mapa
Estoy usando Leaflet.js para un mapa. Ahora quiero eliminar capas añadidas del mapa. Al hacer clic en el botón de entrada #, todas las casillas de verificación marcadas se cambiarán a desactivadas y todas las capas correspondientes se eliminarán del mapa.
Para eliminar una capa del mapa, se necesita el ID de la capa. Esta identificación es igual a la identificación de la casilla correspondiente. Es por eso que uso jQuery para obtener los identificadores de todas las casillas de verificación marcadas y almacenar su valor en un objeto, aquí llamadosomeObj.idsChecked.
Cuando intento usar el valor almacenadoval para eliminar una capa no funciona mientras que laconsole.log muestra el valor deseado. Aquí por ejemplo: mapcat52.
Mientras inserta el ID anterior codificado en la función comomap.removeLayer (mapcat52) funciona como se esperaba.
¿Dónde está el error en mi código o mis pensamientos?
Cualquier ayuda es muy apreciada.
El HTML
<input type="button" id="selectnone" value="deselect all" />
<!-- checkboxes -->
<input id="mapcat52" type="checkbox" name="maplayer" class="maplayer">
<label for="mapcat52">Map Layer One</label>
<input id="mapcat53" type="checkbox" name="maplayer" class="maplayer">
<label for="mapcat53">Map Layer Two</label>
...
El JS:
$('#selectnone').click(function() {
var someObj = {};
someObj.idsChecked = [];
$("input:checkbox").each(function() {
if ($(this).is(":checked")) {
someObj.idsChecked.push($(this).attr("id"));
}
}).attr('checked', false);
$.each(someObj.idsChecked,function(id, val) {
// displays the wanted value, e.g. "mapcat52" if checkbox with this id is checked
console.log(val);
// does not work: inserted value
map.removeLayer(val);
// works: hard coded value of the leaflet.js/input id
map.removeLayer(mapcat52);
});
});