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

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)

Answer 4

In the map click event you assign this to the markerObj. Though this refers to the map object and not the marker object.
Change it to
markerObj = point;
and it should work as expected.

Answer 5

I had a similar error, I'm not sure if my solution applies to your case, nevertheless.. I set up my code so that when my page loaded the map would be filled up with any markers from coordinates denoted in my database. Then I allowed the user to add more points to the database and then added a marker to the user's selected location on the map.
What I didn't realize is that any time a coordinate was changed or created in my database my code was re-adding markers to all the coordinates on my map. So anytime I created a point I was both manually adding a marker to the coordinates and my database was adding a marker to the coordinates. So when I thought my code was broken what was really happening is I was deleting one of two points in the same location.
So I don't know exactly how you're pulling in coordinates and markers from you database but it's worth looking into.

Answer 6

For future people, using "marker.setVisible(false);" works for me
marker.setVisible(false);//this line works
marker.setMap(null);
marker.setPosition(null);
marker = null;