你好，点聚合的案例有吗

[jaywcjlove]

@xiangjiayu 参照官方示例，来写哦， API都弄出来了。

[xiangjiayu]

ok，我按官方实例写出来了

[jaywcjlove]

@xiangjiayu 欢迎分享你的示例。

[xiangjiayu]

官方文档的实例就是把marker 集合成数组 。调用即可。new BMapLib.MarkerClusterer(map, { markers });

import React, { useState, useEffect, useRef } from 'react';
import { connect, Dispatch } from 'umi';
import { APILoader, useMap, useMarker, useInfoWindow, useLabel, useCircle } from '@uiw/react-baidu-map';
import { isEmpty } from 'lodash';
import { GridContent } from '@ant-design/pro-layout';
import { Spin } from 'antd';
import styles from '../AuntDistribution/index.less'

interface AuntPolymerizeProps {
  dispatch: Dispatch;
}

const AuntPolymerize: React.FC<AuntPolymerizeProps> = (props) => {
  const { dispatch } = props;

  const [center, setCenter] = useState<string | BMap.Point>('南京市');
  const [point, setPoint] = useState<any>([]);

  const Example = () => {
    const divElm = useRef<any>(null);

    const onLoad = (e: any) => {
      if (e && e.target) {
        if (!isEmpty(point)) {
          const markers: any = [];
          point.forEach((item: any) => {
            const pt = new BMap.Point(item.longitude, item.latitude);
            const ptMarker = new BMap.Marker(pt);
            markers.push(ptMarker);
            // 标点添加点击事件
            orderMarker.addEventListener('click', () => {});
          });
          // 点聚合
          new BMapLib.MarkerClusterer(map, { markers });
        }
      }
    };
    const { map, setContainer } = useMap({
      center,
      enableMapClick:true,
      zoom:16,
      enableScrollWheelZoom:true,
      onLoad,
    });

    useEffect(() => {
      if (divElm.current) {
        setContainer(divElm.current);
      }
    });
    return <div ref={divElm} style={{ height: '100%' }} />
  };

  return <div className={styles.mapWrap}>
        <APILoader>
          <Example />
        </APILoader>
      </div>
};

export default connect()(AuntPolymerize);