views:

221

answers:

1

After some advice on how to clear markers on googlemaps, I have a map which I would like to have only one marker showing (basically the last marker clicked). I would like the user to be able to change thier mind and click multiple times, but not have confusing map of previous clicks etc.

I have tried the map.clearOverlay(); function, but it seems to permantly clear the whole 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());
    }
}
A: 

Untested, but should do what you want - note that the setLatLng method of GMarker was introduced in API version 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());
    }
}

It works by using a variable, showMarker, containing a reference to a function. This starts out pointing to a function, showNewMarker, which creates a marker, adds it to the map, and then changes showMarker to point to the function updateExistingMarker, which simply uses setLatLng to move the marker to a new position. This means that, on subsequent clicks, the existing marker will be moved to the location of the click.

NickFitz
Thanks - that's really helpfull!