What is the difference between "marker.setVisible(false)" and "marker.setMap(null)" in Google Maps v3?
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 theMap
. If you do not keep a reference to theMap
object, you wouldn't be able to reshow the marker.In addition, the
setMap()
method will not trigger thevisible_changed
event, while thesetVisible()
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.
Another key distinction is that setMap(NULL)
releases the resources associated with the marker whereas setVisible(false)
just makes the marker invisible, but the resources associated with the marker are still allocated.
If you're dealing with 100s or 1000s of markers, this can become a significant performance and memory issue.