调用函数后如何删除传单Javascript上的标记

Question

在传单地图上调用 BusStopMrker 函数后，我试图删除弹出图标。 当我使用“mymap.removeLayer()”时，这会返回一个实例习惯的错误。

我创建了一个 var 标记作为“marker_1”的名称来删除它，但是当我调用函数“BusSTopMarker”时，它似乎并没有每次都存储在它上面。之前的图层信息好像消失了。

并且还尝试使用控制台调用 mymap 并使用 mymap._layers 查找图层并将其删除，但弹出图标仍在地图上。

我的目标是当我调用“BusStopMarker”时，我想删除以前的标记。

请看我的代码，请在这件事上帮助我

var mymap = L.map('mapid').setView([1.35362664583092, 103.83422172361446], 13);
var mymap_layer01 = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
    attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
    maxZoom: 18,
    id: 'mapbox/streets-v11',
    tileSize: 512,
    zoomOffset: -1,
    accessToken: 'mytoken...'
}).addTo(mymap);


function BusStopMarker(BusStopCode, Description, Latitude, Longitude) {
var marker_1 = L.marker()
    console.log("Marker: ",marker_1)
        if (Object.keys(mymap._layers).length >= 2) {

          console.log("marker existing")
          mymap.removeLayer(marker_1)
          console.log("mymap: ", mymap)
          //mymap_layer01
        };

        var marker_1 = L.marker(
             [Latitude, Longitude],
             {}
        ).addTo(mymap);


        var icon_1 = L.AwesomeMarkers.icon(
                {"extraClasses": "fa-rotate-0", "icon": "glyphicon glyphicon-map-marker", "iconColor": "white", "markerColor": "red", "prefix": "glyphicon"}
            );
        marker_1.setIcon(icon_1);
        
    
        var popup_1 = L.popup({"maxWidth": "100%"});
        var html_1 = $(`<div id="html_1" style="width: 100.0%; height: 100.0%;">Bus Stop ID :<b>`+BusStopCode +`</b></div>`)[0];
        popup_1.setContent(html_1);
        marker_1.bindPopup(popup_1);
        marker_1.bindTooltip(
                `<div><b>`+ Description  +`</b></div>`,
                {"sticky": true}
            );
        mymap.setView([Latitude, Longitude]);
        };

提前致谢。

Answer 1

将变量marker_1设为全局变量，以便您可以在下一个函数执行时访问它并将其从映射中移除：

var marker_1 = null;

function BusStopMarker(BusStopCode, Description, Latitude, Longitude) {
    if (marker_1) {
        mymap.removeLayer(marker_1);
    }

    var icon_1 = L.AwesomeMarkers.icon({
        "extraClasses": "fa-rotate-0",
        "icon": "glyphicon glyphicon-map-marker",
        "iconColor": "white",
        "markerColor": "red",
        "prefix": "glyphicon"
    });

    var marker_1 = L.marker(
        [Latitude, Longitude], {
            icon: icon_1
        }
    ).addTo(mymap);

    var popup_1 = L.popup({
        "maxWidth": "100%"
    });
    var html_1 = $(`<div id="html_1" style="width: 100.0%; height: 100.0%;">Bus Stop ID :<b>` + BusStopCode + `</b></div>`)[0];
    popup_1.setContent(html_1);
    marker_1.bindPopup(popup_1);
    marker_1.bindTooltip(
        `<div><b>` + Description + `</b></div>`, {
            "sticky": true
        }
    );
    mymap.setView([Latitude, Longitude]);
};