Listen markercluster click event

[nmccready]

From @markitosgv on July 15, 2014 18:1

Its possible to acces clusterclick, without overlays??

My initial map:

//map initial
    angular.extend($scope, {
        center: {
            autoDiscover: true
        },
        defaults: {
            scrollWheelZoom: false
        },
        layers: {
            baselayers: {
                osm: {
                    name: 'OpenStreetMap',
                    url: 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
                    type: 'xyz'
                }
            }
        }
    });

And then i call my own service to fecth markers data:

    //on load map
    $scope.$on('leafletDirectiveMap.load', function(event){

       api.getMarkersByProximity(function(data){
             $scope.markers.push(data);
        });

       });

Now i have a map with markers and clusters. With this event i can listen when a marker is clicked, but not a cluster:

$scope.$on("leafletDirectiveMarkersClick", function(event, args){
        console.log($scope.markers[args]);
    });

Its possible to do?? thanks I don´t want when cluster marker is clicked to expand child markers... i want to get child markers data to do another thing.

On official Leaflet.markercluster docs says:

markers.on('clusterclick', function (a) {
    console.log('cluster ' + a.layer.getAllChildMarkers().length);
});

Is any event directive to listen?

Copied from original issue: tombatossals/angular-leaflet-directive#421

[nmccready]

From @joeljeske on March 12, 2015 22:38

@markitosgv, have you found a way to listen for cluster events?

[nmccready]

From @rasmi on June 15, 2015 19:42

Has anyone found any ways to listen besides dipping down into pure Leaflet (like @joeljeske did in #648)? As @markitosgv points out, this method relies on layers.

[AppDevGuy]

I believe I have found a solution (finally). It works for all prescribed events (clustermouseover , clusterclick, etc ). I hope this helps prevent people from going bald or insane.

$timeout(function(){
    leafletData.getLayers().then(function(layers) {
        $scope.markerClusterGrp = layers.overlays.locations;
        var clusters            = $scope.markerClusterGrp.getLayers();
        $scope.markerClusterGrp.on('clustermouseover', function (a) {
            var clusterObjects = a.layer.getAllChildMarkers();
            console.log(clusterObjects);
        });
        $scope.markerClusterGrp.on('clusterclick', function (a) {
            var clusterObjects = a.layer.getAllChildMarkers();
            console.log(clusterObjects);
        });
    });
},1000);

Enjoy.