如何在使用angular-leaflet-directive時自定義markercluster圖標

Question

Leaflet文檔概述了一種用iconCreateFunction指定MarkerClusterGroup的方法，您可以在其中自定義集羣圖標的外觀。我想知道是否有通過angular-leaflet-directive公開的東西暴露出來，這樣做也可以做到這一點，或者有一種方法可以讓使用該指令的下層Leaflet API執行此操作。基本上，我只是試圖改變顏色改變的值而不是10和100，以及我想改變圖標的​​直徑以不同的值。類似於Google MarkerClusterer。

感謝

Answer 1

在您指定markercluster，您可以添加選項覆蓋。例如：

layerOptions: { 
          showCoverageOnHover: false, 
          disableClusteringAtZoom: 12, 
          iconCreateFunction: function (cluster) { 
            var childCount = cluster.getChildCount(); 

            var c = ' marker-cluster-'; 
            if (childCount < 10) { 
             c += 'small'; 
            } else if (childCount < 100) { 
             c += 'medium'; 
            } else { 
             c += 'large'; 
            } 

            return new L.DivIcon({ html: '<div><span>' + "CUSTOM" + '</span></div>', className: 'marker-cluster' + c, iconSize: new L.Point(40, 40) }); 
           } 
         }