更改传单标记簇中小、中、大的尺寸

Question

我想更改标记簇中小、中、大 3 种尺寸的尺寸限制。

我在leaflet.markercluster.js文件中找到了它：

_defaultIconCreateFunction:function(e){var t=e.getChildCount(),i=" marker-cluster-";return i+=t<10?"small":t<100?"medium":"large"

但我想在加载我的地图的js文件中更改它，这样我就不必记住每次获得新版本时都更改它。

我对该文件中的标记簇的所有了解是：

var clusterLayer = L.markerClusterGroup({showCoverageOnHover: false, maxClusterRadius: 40, spiderLegPolylineOptions: {weight: 5, color: '#E0AA5E', opacity: 0.9 }});

Answer 1

使用MCG的

iconCreateFunction

选项：

您可以提供自己的函数来为聚集的标记创建图标。默认实现会在 10 和 100 的范围内更改颜色，但更高级的用途可能需要对此进行自定义。

因此，根据您的情况，您可以这样做：

var clusterLayer = L.markerClusterGroup({
  iconCreateFunction: function (cluster) {
    // Adapted from https://github.com/Leaflet/Leaflet.markercluster/blob/master/src/MarkerClusterGroup.js#L821-L834
    var childCount = cluster.getChildCount();

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

    return new L.DivIcon({ html: '<div><span>' + childCount + ' <span aria-label="markers"></span>' + '</span></div>', className: 'marker-cluster' + c, iconSize: new L.Point(40, 40) });
  },
  // Other options...
});