Leaflet markercluster - cluster/uncluster toggle

Question

Is it possible to toggle between clustered and unclustered with a leaflet MarkerClusterGroup?

I know I can disable clustering at max zoom levels using the disableClusteringAtZoom param below

markerHolder = new L.MarkerClusterGroup({
    disableClusteringAtZoom: 18,
    maxClusterRadius: 80,
    spiderfyDistanceMultiplier: 1,
})

I would like to add a button that clusters/unclusters on click

Answer 1

There is no 'uncluster' function to call per se, but you could keep both a clustered and unclustered version of your data available, and toggle between them when you click a button

var cluster = L.markerClusterGroup();
var marker = L.featureGroup();

for (var i = 0; i < points.length; i++) {
    var point = points[i];
    var marker = L.marker(new L.LatLng(point[0], point[1]));
    cluster.addLayer(marker);
    markers.addLayer(marker);
}

see: https://github.com/Leaflet/Leaflet.markercluster/issues/393

Answer 2

FWIW, I made a Leaflet.markercluster subplugin for such feature a while ago: Leaflet.MarkerCluster.Freezable

It provides extra methods on Leaflet.markercluster, including disableClustering() and enableClustering(), which enable you to uncluster / cluster programmatically (e.g. on a button click) without needing the user to zoom in/out.

See also the plugin demo page.

Of course, you should be careful whenever you call disableClustering(), since you may instantly load all your markers on map (if you are zoomed out to their full extent). If that tries loading thousands of markers, you may freeze your browser or even crash it.

Disclaimer: I am the author of this plugin.

See also this post on StackOverflow: With Leaflet markercluster, how can I switch between clustered and unclustered without changing zoom level?