How to hide and show MarkerClusterer in google maps

google-maps-markers, javascript, markerclusterer, show-hide

Solution

I've been struggling the whole morning with this but fortunately I got to a solution.

First of all, make sure you have the latest MarkerClustererPlus version https://github.com/googlemaps/js-marker-clusterer

then it is very easy,

When creating the markers make sure you

set its visible flag to false.

And when creating the marker clusterer do it this way:

new MarkerClusterer(map, markers, { ignoreHidden: true });

if you want to show the clusterer just do this:

for (var it in markers) {
    markers[it].setVisible(true);
}

markerCluster.repaint();

to hide the cluster:

for (var it in markers) {
    markers[it].setVisible(false);
}

markerCluster.repaint();

Hope it helps, regards

Problem

i'm trying to hide/show markerClusterer when user clicks some buttons: Here is what i'm trying to do: ``` map = new google.maps.Map(document.getElementById("mappa"),mapOptions); var marker_tmp = []; var markers_tmp = []; $.each(json,function(index,value){ var latLng = new google.maps.LatLng(value.lat,value.lng); var marker = new google.maps.Marker({'position': latLng}); if((value.candidato in markers_tmp)==false){ markers_tmp[value.name]=[]; } markers_tmp[value.name].push(marker); }); for(var name in markers_tmp){ markers[name]= new MarkerClusterer(map,markers_tmp[name]); } ``` I create multiple markerClusterer each one is associated to a particular name. So i have some buttons associated to these particular name and i need to hide/show the marker clusterer associated with that button. ``` /*This is the function associated to a button when it is clicked*/ function hide_show_cluster(name,visible){ var tmp_cluster = markers[name]; //call a function of markerClusterer (tmp_cluster) to hide/show it } ``` I've done lots of tests but no one satisfy my request. Can someone help me? Thanks!

Original source