MarkCluster with Leaflet layers

[gsambrotta]

hello! I'm using your amaz plugin for my map but now that i intriduced layers everything get messed up.
Clusters add markers directly to the map not connecting them with my layers, that means when I click on layer to show/hide markers, i still see some markers, the one that were aggregated.
Any idea/examples how to deal with that?

What i do is in my createMarkers function:

marker.bindPopup(dit.popup).addTo(dit.category); //dit.category are alle my layers taken from a loop of json objects

dit.map.addLayer(dit.markersCluster);```


Thank you very much!

[danzel]

I'm not totally sure what you are up to, but you probably need to add/remove the layers from the MarkerClusterGroup rather than the map?

[gsambrotta]

What i try to achive is make MarkerCluster work with an layersGroup from leaflet, like in this examples: http://bl.ocks.org/ismyrnow/6123517

So in my code I create MarkerCluster function
dit.markersCluster = new L.MarkerClusterGroup({ iconCreateFunction: function(cluster){ return new L.DivIcon({ html: cluster.getChildCount(), className: 'map__marker-cluster', iconSize: L.point(40, 40) }); } });

then i add them to my markers and map

dit.markersCluster.addLayer(marker);
dit.map.addLayer(dit.markersCluster);

but at the same time I add my marker to my layersGroup
marker.bindPopup(dit.popup).addTo(dit.allMarkers); //dit.allMarkers is my layer. It will show a checkbox in the legend and when clicked markers show or hide.

So when I click allMarkers checkbox on map legenda, the markers aggregated by cluster are still visible.

I didn't find any examples of MarkClusters used with layersGroup so i wonder if is possible..

[ghybs]

Hi,

Please do you still have troubles in using MarkerClusterGroup?

If my understanding is correct, you simply want a control overlay (of type L.control.layers) in order to show/hide markers in your markerClusterGroup ? (yes, the vocabulary might be confusing)

First of all, be very cautious when adding markers to more than one layerGroup, especially a markerClusterGroup (which is a layerGroup as well). The latter will fiddle a lot with it, as you noticed.

Instead, why not simply adding your MarkerClusterGroup dit.markersCluster directly to your layerGroup dit.allMarkers? (Yes, you should be able to nest a markerClusterGroup in a layerGroup, that is the magic of Leaflet interfaces) Then do not add dit.markersCluster to the map, as it will be added together with dit.allMarkers.

This way, your controlLayers should show/hide everything inside dit.allMarkers, including your dit.markersCluster.

Finally, if dit.allMarkers does not contain anything else beyond dit.markersCluster, you no longer need it, simply add dit.markersCluster to your controlLayers.

Please note that in the case of the example you mention, there are several overlays in the controlLayers. If you want to achieve something similar but with MarkerClusterGroup, you will need 1 instance of MarkerClusterGroup per desired overlay. They will not be able to cluster markers from one each other.

The way L.Control.Layers is built, it directly adds/removes the given layers from the map, not from a layerGroup. If you would like a single MarkerClusterGroup instance that will get stripped from some markers when unchecking the controlLayers, you will probably have to program a custom L.Control.Layers. That may be a meaning of danzel's above reply.

Hope this helps.

[ghybs]

I apologize for commenting again on this closed thread, but it is just to refer to #13 which I think is a good solution for the "complex" use case of using a layers control (or external UI) to add/remove markers from a single MCG.

[gsambrotta]

Hey @ghybs thank for the answer. I already fix my problems time ago but since when i was researching for my issue i found many imilar quetsions but really few answers, i thinkis a good documentation for the future and hopefullly for other people.

At the end, as you just suggested, i created many different layers, and add/remove MCG to each of them.
It worked!

Honestly the code wasn't very beautiful nor very modular.
I think next time i will add all my markers and MCG to one level and then create my controller with plain Javascript.
But that's are my two cents :)