使用 markercluster 和 angular-leaflet-directive 捕获集群上的点击事件

问题描述

我正在使用 angular-leaflet-directive，并获得标记鼠标点击的名字是直截了当的.我只是监听 leafletDirectiveMarker.click 事件，然后访问 args.markerName.

I'm playing with the angular-leaflet-directive, and getting the marker names from a mouse click is straight forward. I just listen for the leafletDirectiveMarker.click event and then access args.markerName.

angular-leaflet-directive 也适用于 markercluster，因此我可以将具有相同的坐标或附近的坐标.但是，我想执行以下操作，但是文档中不清楚如何执行此操作:

angular-leaflet-directive also works with markercluster, so I can cluster markers that have the same coordinates or ones that are close by. However, I would like to do the following, but it is not clear from the documentation on how to do it:

• 让用户双击集群进行放大.当前单击集群将放大标记.参见示例.

• Make user double-click on cluster to zoom in. Currently doing a single click on a cluster will zoom in on the markers. see example.

如何监听集群上的点击事件并获取集群中的所有标记名称.clustermarker 的文档有一个集群事件:

How to listen for click event on cluster and get all marker names in the cluster.The documentation for clustermarker has a cluster event:

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

但我不确定我应该使用 angular-leaflet-directive 收听什么事件.

But I'm not sure what event I should be listening to using angular-leaflet-directive.

推荐答案

和很多人一样，我也搜索了很长时间没有结果.在尝试另一种方法时，我遇到了这个:

Much like many people, I too had a long search with no results. While experimenting with another method, I came across this:

$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);

它的工作原理是一样的，不同之处在于它需要超时才能等待图层使用所有标记进行渲染(我的理解，如果错误，请纠正我:-)).

It works the same, the difference is that it requires a timeout in order to wait for the layer to render with all markers (my understanding, correct me if wrong :-) ).

我希望这可以帮助任何寻找角度解决方案的人.请记住在您的控制器依赖项中包含 $timeout .

I hope this helps anyone searching for an angular solution. Just remember to include $timeout in your controller dependencies.

这篇关于使用 markercluster 和 angular-leaflet-directive 捕获集群上的点击事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！