javascript - Google map - 删除以前的标记

Question

在关于如何清除谷歌地图上的标记的一些建议之后，我有一张 map ，我希望只显示一个标记(基本上是单击的最后一个标记)。我希望用户能够改变主意并多次点击，但不会出现先前点击等的困惑 map 。

我尝试过map.clearOverlay();功能，但它似乎永久清除了整个 map 。

function initialize() {

    if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("googlemap"));

        map.setCenter(new GLatLng(50.401515,-4.866943), 8);

        GEvent.addListener(map,"click", function(overlay,latlng) {     
            if (latlng) {   
                var myHtml = "" + latlng ;
                split=myHtml.indexOf(",");       
                x=Math.round(myHtml.slice(1,split)*1000000)/1000000;
                y=Math.round(myHtml.slice(split+1,myHtml.length-1)*1000000)/1000000;
                document.collector.latitude.value=x;
                document.collector.longitude.value=y;
                lat="<br />Latitude: " + x;
                lon="<br />Longitude: " + y;
                latlon=""+lat+lon;

                //map.openInfoWindow(latlng, latlon);
                map.clearOverlay();
                map.addOverlay(new GMarker(latlng));
            }
        });
        map.addControl(new GLargeMapControl3D());
        map.addControl(new GMapTypeControl());
    }
}

Answer 1

未经测试，但应该做你想做的 - 请注意 <a href="http://code.google.com/apis/maps/documentation/reference.html#GMarker.setLatLng" rel="noreferrer noopener nofollow">setLatLng</a>方法GMarker在 API 版本 2.88 中引入:

function initialize() {

    if (GBrowserIsCompatible()) {
        var marker;

        function showNewMarker(latlng) {
            marker = new GMarker(latlng);
            map.addOverlay(marker);
            showMarker = updateExistingMarker;
        }

        function updateExistingMarker(latlng) {
            marker.setLatLng(latlng);
        }

        var showMarker = showNewMarker;

        var map = new GMap2(document.getElementById("googlemap"));

        map.setCenter(new GLatLng(50.401515,-4.866943), 8);

        GEvent.addListener(map,"click", function(overlay,latlng) {     
            if (latlng) {   
                var myHtml = "" + latlng ;
                split=myHtml.indexOf(",");       
                x=Math.round(myHtml.slice(1,split)*1000000)/1000000;
                y=Math.round(myHtml.slice(split+1,myHtml.length-1)*1000000)/1000000;
                document.collector.latitude.value=x;
                document.collector.longitude.value=y;
                lat="<br />Latitude: " + x;
                lon="<br />Longitude: " + y;
                latlon=""+lat+lon;

                //map.openInfoWindow(latlng, latlon);
                map.clearOverlay();
                showMarker(latlng);
            }
        });
        map.addControl(new GLargeMapControl3D());
        map.addControl(new GMapTypeControl());
    }
}

它通过使用变量 showMarker 来工作。 ，包含对函数的引用。首先指向一个函数 showNewMarker ，这会创建一个标记，将其添加到 map 中，然后更改 showMarker指向函数 updateExistingMarker ，它简单地使用 setLatLng将标记移动到新位置。这意味着，在后续点击中，现有标记将被移动到点击位置。