zjm1126 zjm1126 - 2 months ago 14
Javascript Question

What is the difference between "marker.setVisible(false)" and "marker.setMap(null)" in Google Maps v3?

I want to clear a marker on Google Maps.

What is the difference between

marker.setVisible(false)
and
marker.setMap(null)
?

But I don't know, which is right?

Answer

The difference between the two methods does not seem to be clearly documented. However, note the following:

  • When you use setMap(null), your marker will lose the reference to the Map. If you do not keep a reference to the Map object, you wouldn't be able to reshow the marker.

  • In addition, the setMap() method will not trigger the visible_changed event, while the setVisible() method does (if the visibility is actually toggled).

Example:

var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 4,
  center: new google.maps.LatLng(-25.363, 131.044),
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var marker = new google.maps.Marker({
  position: new google.maps.LatLng(-25.363, 131.044), 
  map: map
}); 

google.maps.event.addListener(marker, 'visible_changed', function() {
  console.log('visible_changed triggered');
});

marker.setVisible(false); // visible_changed triggered
marker.setVisible(true);  // visible_changed triggered
marker.setMap(null);      // visible_changed not triggered
marker.setMap(map);       // visible_changed not triggered

I guess we should be using the setVisible(false) method when we intend to reshow the marker again on the map, and the setMap(null) when we will not be showing it again.