feat(MarkerCluster): 代码优化

package.json

@@ -34,6 +34,8 @@
   "dependencies": {
     "@pansy/react-hooks": "^2.3.0",
     "@pansy/shared": "^1.15.0",
+    "@turf/bbox": "^6.5.0",
+    "@turf/helpers": "^6.5.0",
     "@types/supercluster": "^7.1.3",
     "lodash-es": "^4.17.21",
     "supercluster": "^8.0.0",

src/components/MarkerCluster/MarkerCluster.tsx

@@ -1,7 +1,10 @@
 import { useState, useMemo, useEffect, useCallback, useImperativeHandle, forwardRef } from 'react';
 import { isFunction } from '@pansy/shared';
+import { LngLatBounds } from 'mapbox-gl';
 import Supercluster from 'supercluster';
 import { debounce } from 'lodash-es';
+import bbox from '@turf/bbox';
+import { featureCollection } from '@turf/helpers';
 import { defaultSuperclusterOptions } from './config';
 import { Marker } from '../Marker';
 import { useMap } from '../../hooks/useMap';
@@ -51,6 +54,8 @@ export const MarkerCluster = forwardRef<Supercluster, MarkerClusterProps>((props
     debounce(() => {
       const mapBoundary = getMapBoundary();
 
+      console.log(333);
+
       const result = supercluster.getClusters(...mapBoundary);
 
       setList(result);
@@ -73,14 +78,27 @@ export const MarkerCluster = forwardRef<Supercluster, MarkerClusterProps>((props
     const { properties } = data;
 
     if (!properties?.cluster) return;
+
+    console.log(111);
+    const children = supercluster.getLeaves(properties.cluster_id, Infinity);
+    console.log(222);
+    const childrenBbox = bbox(featureCollection(children));
+
+    map.fitBounds(LngLatBounds.convert(childrenBbox as any), {
+      padding: 20,
+    });
   };
 
+  console.log(list);
+
   return (
     <>
       {list.map((item, index) => {
         const { geometry, properties } = item;
         const { point_count, cluster, cluster_id } = properties;
 
+        console.log(item);
+
         if (cluster) {
           return (
             <Marker