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!
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