標記未被刪除：單張

Question

我正在處理單張api.Where我添加了標記的自定義控件。

而且我有一個按鈕，傾向於刪除所有標記。

問題

通過包裝，我必須刪除所有標記，但功能不工作....瀏覽器不給予任何控制檯錯誤，讓我在黑暗中，沒有完全理解API的結構。

腳本

  var markers = new L.FeatureGroup(); 
      map.on('click', function markerPlace(e) { 
       //L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map); 
      marker = L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map); 
       markers.addLayer(marker); 
       map.off('click', markerPlace); 
      }); 
     }).addTo(map); 

    //onClick this button we have to remove all marker 
    <button id="removeMarker">Remove Markers</button>  
    $('#removeMarker').click(function (e) {map.removeLayer(markers) }); 

如果有人有關於這個想法，請幫助或任何形式的參考值將是您的時間appreciated.Thanks

Answer 1

當你正確的ident你的代碼，你可以很容易地發現的第一個錯誤：

var markers = new L.FeatureGroup(); 

map.on('click', function markerPlace(e) { 
    //L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map); 
    marker = L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map); 
    markers.addLayer(marker); 
    map.off('click', markerPlace); 
}); 

}).addTo(map); // <- What is this doing here 

這應該會給你一個很大的控制檯錯誤。我假設屬於你L.FeatureGroup這樣的：

var markers = new L.FeatureGroup().addTo(map); <- Moved to here 

map.on('click', function markerPlace(e) { 
    //L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map); 
    marker = L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map); 
    markers.addLayer(marker); 
    map.off('click', markerPlace); 
}); 

所以你要添加到L.FeatureGroup稱爲markers那麼爲什麼它們添加到地圖中的標記？

marker = L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map); 

這應改爲：

marker = L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(markers); 

因此，在短期：在地圖上的點擊事件你想刪除標記從地圖上看，這還沒有被適當地添加featurelayer和您已將標記添加到地圖中，而不是功能組。

PS：你想刪除標記，但你實際上想要做的是刪除整個功能組。如果您想離開功能組並且只移除標記，您可以使用方法L.FeatureGroup：

markers.clearLayers();