Невозможно добавить слои динамически в группу слоев при щелчке флажков с помощью Листовки

Question

моя проблема: я не могу удалить слой каждого флажка, я уже опубликовал эту проблему, к сожалению, я не получил никакого ответа. Теперь я пытаюсь использовать группу слоев, которую я добавляю к ней для каждого щелкнутого флажка, но когда я пытался удалить каждый слой, он удаляет последний, поэтому я заметил, что слои не добавляются в группу слоев. Итак, как добавить слои в группу слоев динамически, другими словами как добавить слой каждый раз, когда я нажал на данный флажок? Можете ли вы мне помочь, чтобы выяснить, в чем проблема? Любая помощь приветствуется. Вот фрагмент кода:

PHP файл:

<script type="text/javascript"> 
 

 
$(document).ready(function(){ 
 

 
$('input[id^="DisplayCheckbox"]').on('click',function() 
 
{ 
 
    parent = $(this).val(); 
 
    Coord = $(this).parents('#' + parent).find("li.Liste").text(); 
 
    window.valChk = $(this).val(); 
 
      
 
      if($(this).is(":checked")) 
 
      { 
 
       valChk = $(this).val(); 
 
       
 
       $.drawPoly(Coord); 
 

 
      }else 
 
      {  
 
       $.removePoly(valChk); 
 
        
 
      } 
 
     
 
}); 
 

 
}); 
 
     
 
</script>

внешний JQuery файл:

$.drawPoly = function(data) 
 
{ 
 
     data = $.parseJSON(data); 
 
       
 
     var geojsonFeature = 
 
    { 
 
     "type": "FeatureCollection", 
 
     "features": [{ 
 
      "type": "Feature", 
 
      "geometry": { 
 
      "type": data.type, 
 
      "coordinates": data.coordinates 
 
         } 
 
        }] 
 
     }; 
 

 
       
 
     window.poly=L.geoJson(geojsonFeature); 
 
     poly.id = valChk; 
 
     layerGrp=L.layerGroup([poly]); 
 
     addLayer(valChk); 
 
    
 
}; 
 
    
 
function addLayer(id){ 
 
    layerGrp.eachLayer(function (layer) { 
 
     if(layer.id == id){ 
 
      layerGrp.addLayer(layer).addTo(map); 
 
      map.fitBounds(layer.getBounds()); 
 
      console.log(layer._leaflet_id); 
 
     } 
 

 
    }); 
 
    } 
 

 
    $.removePoly = function(id) 
 
    { 
 
     layerGrp=L.layerGroup([poly]); 
 
     
 
     layerGrp.eachLayer(function (layer) { 
 
      
 
      if(layer.id == id) 
 
      { 
 
       console.log(layer._leaflet_id); 
 
       layerGrp.removeLayer(layer); 
 
      } 
 
     }); 
 
    
 
    };

Answer 1

Мне кажется, что answer на ваш предыдущий вопрос по этому вопросу по-прежнему действует для кода, который вы разместили здесь: у вас, кажется, есть вопрос вопрос (фактически, некоторые из них).

Чтобы быть более конкретным, ваша переменная layerGrp используется глобально и переопределяется в пределах $.removePoly (инструкция layerGrp=L.layerGroup([poly])). Поэтому вы теряете ссылку на предыдущие слои, добавленные вами в карту, в addLayer, и вы больше не сможете их удалить.

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

Как только вы упростите его, я уверен, что вы сможете решить вашу проблему.