传单标记，群集标记和群集图标在加载时均可见

Question

在加载地图后，图钉和标记集群图标均可见。只有在放大到最大后，所有引脚才会断开，并且群集将按照缩小的预期开始工作。

我做错了什么会导致此问题？

当前设置：

const markerCluster = Leaflet.markerClusterGroup({showCoverageOnHover: false})

//within a loop the markers are created:

() => {
  const pinBackground = item.current ? '#db2828' : '#3dcc4a'
  const interior = item.pin.icon_url
    ? `<img style="background: ${item.pin.color_code}" src=${item.pin.icon_url}>`
    : `<div class="mapPanelAbbreviation" style="background: ${item.pin.color_code}">${item.pin.abbreviation}</div>`
  const pinLayout = `<div class="mapPanelIconContainer" style="background:${pinBackground}">
      ${interior}
    </div>`

  let marker = Leaflet.marker(coord, {icon: Leaflet.divIcon({html: pinLayout})})
    .bindPopup(`<p class='pinText'>${item.taskId}</p><p class='pinDetails'>${item.title}</p>`)
    .addTo(this.currentMap)
    .addTo(this.markerGroup)

  markerCluster.addLayer(marker)
}

//then the markerCluster is added to the map

this.currentMap.addLayer(markerCluster)

加载地图时，我会看到创建的引脚（应包含在markerCluster中）和显示带有引脚数的群集图标：

第一次缩放后：

与往常一样，任何方向和帮助都非常感谢，因此，谢谢！！

Answer 1

只需将您的标记添加到地图（或添加到地图的任何其他图层组），而不是将其添加到您的MarkerClusterGroup：

let marker = Leaflet.marker(coord, {icon: Leaflet.divIcon({html: pinLayout})})
  .bindPopup(`<p class='pinText'>${item.taskId}</p><p class='pinDetails'>${item.title}</p>`)
  //.addTo(this.currentMap) // this duplicates your Markers
  //.addTo(this.markerGroup) // this also duplicates if markerGroup is added to map

markerCluster.addLayer(marker)