[GIS] Removing polylines from google maps

googlegoogle mapsjavascript

I have a point where a Gpolyline line is drawn from a marker to another point. After I click on it a second time, I want to remove the polyline. How do I remove the line after clicking on the marker a second time?

My pseudo-code is as follows:

  google.maps.event.addListener(markersArray[0], 'click', function() {
     'draw line to point'
  } );

(I did also ask this question on StackOveflow – I'm not sure whether it is ok to post the same question here)

Best Answer

One way - and it's not the only way is to keep a reference to the line you're drawing in the Marker object you've already got, like this:

       GEvent.addListener(markersArray[0], 'click', function() {
         if( markersArray[0].line ) {
            map.removeOverlay( markersArray[0].line );
            markersArray[0].line = null;
         } else {
            var newLine = new GPolyline([
                markersArray[0].getLatLng(),
                markersArray[1].getLatLng()
            ], "#22FF22", 2);
            markersArray[0].line = newLine;
            map.addOverlay( newLine );
         }
       });

You could also save a reference to the line in a global variable. Either way, you need to keep a reference around to be able to remove it later.