why setMap(null) is not working google maps api v3?

Question

I am using google maps api 3.9 .In app user can add marker or delete marker.when user click on map an Infowindow will be displayed.in which user can enter name,lat,long and click the save image as follows:

google.maps.event.addListener(map, 'click', function(event) {

  point = new google.maps.Marker({
    position: event.latLng
    , map: map
    , icon: 'resource/image/mapIcons/point.png'
    , id: id
    , type:"point"
  });

  type = point.type;
  newPoint = true;
  existingPoint = false;
  markerObj = this;

  inputInfowindow.setContent("<table style='width:92%;' id='inputTable'>" +
                             "<tr> <td>point</td> </tr>" +
                             "<tr> <td><input class='infoInput' type='text' id='name' placeholder='name'/> </td> </tr>" +
                             "<tr> <td><input class='infoInput'type='text' id='lat' placeholder='latitude'/></td> </tr>" +
                             "<tr> <td><input class='infoInput'type='text' id='lon' placeholder='longitude'/></td> </tr>" +
                             "<tr><td><input type='image' src='resource/image/mapIcons/save.png' onclick='save()' class='saveImage' alt='save'/> </td></tr>");

  event1 = event.latLng;
  currentMarker = point;
  inputInfowindow.open(map,point);

});

marker saved in DB. when user cliclks on delete button follwing method ll be called:

function deleteMarker(id,rev) {
  var marker  = markerObj;
  markerObj = undefined;
  var x = confirm("are you sure to delete marker?");
  if(x){
    deleteLocations(id,rev);//removes marker details from DB
    if(marker){
      console.log(marker);
      marker.setMap(null);
    }
  }
}

but at marker.setMap(null); marker is removed from map still its on map.I checked with console.log(marker); marker object coming properly,no errors on console.i went through lot of googling but no result.Please help about this.

Answer 1

From the documentation-

To remove an overlay from a map, call the overlay's setMap() method, passing null. Note that calling this method does not delete the overlay; it simply removes the overlay from the map. If instead you wish to delete the overlay, you should remove it from the map, and then set the overlay itself to null.

so after the marker.setMap(null) you should also write marker=null

Update1-

function deleteMarker(id,rev) {
  var x = confirm("are you sure to delete marker?");
  if(x)
  {
    deleteLocations(id,rev);//removes marker details from DB
    if(markerObj)
    {
       console.log(markerObj);
       markerObj.setMap(null);
       markerObj=null;
    }
  }
}

Update 2-

Here is a simple demo that works. See the code and check where your code is wrong. Probably some variable scope issue exists in your code.

WORKING DEMO

Answer 2

marker.setMap(null) does not delete the object, it only hides it. To delete it do marker = null;

Answer 3

I had same problem. You should call these methods before markers[index].setMapp(null) :

map.setCenter(desMarker[index].getPosition());
desMarker[index].setPosition(null);

after these call:

markers[index].setMapp(null)