Leaflet带关联圆形的标记点组聚类显示问题

需求完全可行，问题出在你当前的层级结构设计上：你把包含Marker的mainGroup加入了markerClusterGroup，但关联Circle的subGroup直接绑定到mainGroup，而mainGroup并未被添加到地图，而是由markerClusterGroup接管显示逻辑，导致subGroup无法正确感知Marker的显示状态。

正确实现方式 #

把每个Marker和对应的Circle打包成独立的FeatureGroup，再将这些分组加入markerClusterGroup，确保聚类和解散时，Marker与Circle同步显示/隐藏：

const lMap = L.map('map').setView([51.508, -0.128], 11);
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
  maxZoom: 19,
  attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
}).addTo(lMap);

// 为每个点创建包含Marker和Circle的分组
const pointGroups = [
  L.featureGroup([
    L.marker([51.508, -0.128]),
    L.circle([51.508, -0.128], {
      color: '#38f',
      fillColor: '#38f',
      fillOpacity: 0.2,
      radius: 60
    })
  ]),
  L.featureGroup([
    L.marker([51.5, -0.14]),
    L.circle([51.5, -0.14], {
      color: '#38f',
      fillColor: '#38f',
      fillOpacity: 0.2,
      radius: 40
    })
  ]),
  L.featureGroup([
    L.marker([51.51, -0.1]),
    L.circle([51.51, -0.1], {
      color: '#38f',
      fillColor: '#38f',
      fillOpacity: 0.2,
      radius: 50
    })
  ])
];

const mainCluster = L.markerClusterGroup();
// 将所有点分组加入聚类
pointGroups.forEach(group => mainCluster.addLayer(group));
lMap.addLayer(mainCluster);

原理说明 #

• 每个FeatureGroup把Marker和Circle绑定为一个整体，markerClusterGroup会对整个分组进行聚类管理
• 地图放大到解散聚类时，FeatureGroup会被完整渲染，Marker和Circle同时显示；聚类时整个分组被隐藏，替换为聚类标记

内容的提问来源于stack exchange，提问作者Votemike