Листовка / JS Удаление слоя с переменной

#javascript #html #leaflet

#язык JavaScript #HTML #листовка

Вопрос:

Я пытаюсь удалить слой (я использую самодельный пользовательский интерфейс с выпадающим меню здесь!)

Когда я пытаюсь удалить слой с помощью этого кода: setTimeout(function() {map.removeLayer(mapid); }); я не получаю ошибку, но она ничего не делает. Я вижу в консоли, что значение заполнено правильно.

Если я заменю здесь mapid одним из названий карты, например: setTimeout(function() {map.removeLayer(basicmap); }); он удалит этот слой. Я пытаюсь найти лучший способ сделать это, чем добавить 35 вариантов удаления!

У кого-нибудь есть какие-либо идеи или предложения относительно того, что может помешать удалению слоя?

 var mapselect = "basicmap"; var mapid = "basicmap"; function scheduleA(event) { mapselect = this.value; console.log("map value: "   mapselect); //Remove Everything console.log("map id: "   mapid); setTimeout(function() {map.removeLayer(mapid); });  if (mapselect == "basicmap") {  setTimeout(function() {basicmap.addTo(map); }); console.log('option 0'); } //change the map id to be hard coded here and go back to option 1,2,3,4,5,etc if (mapselect == "outpost1") {  setTimeout(function() {outpost1.addTo(map); }); console.log('option 1'); }  if (mapselect == "recoverymap") { setTimeout(function() {recoverymap.addTo(map); }); console.log('option 2'); }  if (mapselect == "reconmap") { setTimeout(function() {reconmap.addTo(map); }); console.log('option 3'); }  if (mapselect == "exmap") {  setTimeout(function() {exmap.addTo(map); }); console.log('option 4'); } console.log(mapselect); mapid = mapselect;  }  

Для справки здесь приведен HTML — код, вызывающий функцию:

 lt;label for="Map"gt;Choose a Mission:lt;/labelgt;  lt;select name="Map" id="Map" onchange="scheduleA.call(this, event)"gt;  lt;option value="basicmap" selectedgt;lt;/optiongt;  lt;option value="outpost1"gt;Map 1lt;/optiongt;  lt;option value="recoverymap"gt;Map 2lt;/optiongt;  lt;option value="reconmap"gt;Map 3lt;/optiongt;  lt;option value="exmap"gt;Map 4lt;/optiongt;  lt;/selectgt;lt;brgt;lt;brgt;  

Ответ №1:

Ваша проблема заключается setTimeout в том, что это вызовет силу, которая map.removeLayer(mapid); вызывается в конце вашей функции scheduleA . Перед выполнением тайм-аута вы перезаписываете идентификатор mapid новой выбранной картой. Поэтому, когда вызывается удаление, вы удаляете новый добавленный слой -gt; в результате чего кажется, что ничего не произошло (но он добавил новый и снова удалил его).

Я не знаю , зачем вы используете setTimeout , вы можете удалить его, он нигде не нужен

Ответ №2:

Если по какой-то причине вы должны сохранить свои setTimeout значения, просто измените способ обработки текущих и новых значений mapid , указав вместо них предыдущие и «новые текущие» значения:

 const previousMapid = mapid;  // Remove the previous setTimeout(() =gt; map.removeLayer(previousMapid));  // Now you can safely re-assign mapid mapid = this.value;