javascript - 如何删除以下热图中的现有标记并添加新的标记集？

Question

现有标记(工作)已使用类似经度和纬度集的 N block 分配给 map :

m = [42.0167, 24.8667];
marker = L.marker([m[0], m[1]]);
markers.addLayer(marker);

其中m、marker和markers是全局变量。

现在，我想清除 map 上的现有标记，并在执行replaceWithNewMarkers(data)后立即放置新的ajax数据数组:

function replaceWithNewMarkers(data) {
    var obj = jQuery.parseJSON( data );
    //markers.clearLayers(); // #this clears all the markers
    //markers = L.markerClusterGroup();

    // THE FOLLOWING IS ABLE TO ADD NEW MARKERS TO EXISTING MAP
    $.each(obj, function(myVal) {
        m = [obj[myVal][0], obj[myVal][1]];
        marker = L.marker([m[0], m[1]]);
        markers.addLayer(marker);
    });
}

这对于添加新标记来说效果很好，但我无法删除现有标记。我尝试添加 markers.clearLayers(); 来清除标记，但这样做会完全隐藏标记(不可能显示新的标记集)。

关于如何实现这一目标有什么建议吗？

--------添加细节--------

以下是当前正在加载默认标记的初始化程序。

<script>
    var m;
    var marker;
    var markers;
    var map;
    var tiles;
    var latlng;
    var baseLayer;

    window.onload = function() {
        tiles = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
            maxZoom: 18,
            attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors, Points &copy 2012 LINZ'
        });

        latlng = L.latLng(25, -80);

        map = new L.Map('map-canvas', {
            center: latlng,
            zoom: 2,
            minZoom: 2,
            maxBounds: L.latLngBounds(L.latLng(85,-120), L.latLng(-85, 120)),
            layers: [tiles]
        });

        markers = L.markerClusterGroup();

            m = [40.27, 25.87];
            marker = L.marker([m[0], m[1]]);
            markers.addLayer(marker);

            m = [37.455, 20.94];
            marker = L.marker([m[0], m[1]]);
            markers.addLayer(marker);

            m = [57.25, 61.0];
            marker = L.marker([m[0], m[1]]);
            markers.addLayer(marker);

        map.addLayer(markers);

    };

        baseLayer = L.tileLayer(
        'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{
            attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>',
            maxZoom: 18
        }
    );

</script>

Answer 1

使用“map.removeLayer(markers)”删除图层

 function resetMarkers() {
    if (map.hasLayer(markers)) {
        map.removeLayer(markers);
        markers= new L.markerClusterGroup();
        map.addLayer(markers);
    }
 }


 function replaceWithNewMarkers(data) {
     var obj = jQuery.parseJSON( data );
     resetMarkers();

     // THE FOLLOWING IS ABLE TO ADD NEW MARKERS TO EXISTING MAP
     $.each(obj, function(myVal) {
         m = [obj[myVal][0], obj[myVal][1]];
         marker = L.marker([m[0], m[1]]);
         markers.addLayer(marker);
     });
 }

//编辑:将标记层重命名为标记 //编辑2:newMarkerClusterGroup => L.markerClusterGroup();