8
votes

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.

5

5 Answers

13
votes

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

2
votes

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

2
votes

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)

0
votes

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.

0
votes

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.