如何在图层组中使用Leaflet.markercluster

Question

所以我试着用Leaflet.markercluster在我的传单地图上把我的标记分类。目前，我在我的MapContainer函数中使用一个子标记在App()函数中添加标记：

return (
    <MapContainer
      ...
      <AddMarkers />
    </MapContainer>
);

对于上下文，我的AddMarkers函数如下所示：

function AddMarkers() {
  ...
  return (
    <LayerGroup>
      {users.map((user) => (
          <Marker
            ...
          </Marker>
        ))}
    </LayerGroup>
  );
}

在Leaflet.markercluster 文档中，它们解释了可以使用以下思想添加标记集群：

var markers = L.markerClusterGroup();
markers.addLayer(L.marker(getRandomLatLng(map)));
... Add more layers ...
map.addLayer(markers);

如何在代码中使用L.markerClusterGroup()方法？我是否需要重写如何在我的MapContainer中添加标记

Answer 1

这是通过将Markers封装在MarkerClusterGroup标记中解决的。

例如：

<MarkerClusterGroup>
      <Marker />
</MarkerClusterGroup>