HERE Maps如何获取当前视口内所有可见聚合簇及点位数据

getClusterPresentation是聚合图层的主题渲染回调，触发时机是聚合Provider预计算所有缩放层级的聚合簇渲染样式阶段，会遍历全量预生成的簇对象，本身不感知当前地图视口范围、当前生效缩放等级，因此无法在该方法内直接筛选出当前视口可见的簇数据。

不要在主题配置回调中获取可见簇，通过监听地图视图变化事件，结合聚合Provider提供的范围查询API即可拿到目标数据，具体逻辑：

• 监听地图mapviewchangeend事件，该事件在地图平移、缩放操作完全停止后触发，可避免无效重复计算
• 事件触发时先获取当前地图视口的经纬度边界
• 调用聚合Provider的requestBounds方法，传入视口边界，获取当前边界、当前缩放等级下的所有聚合对象
• 遍历返回结果，筛出聚合簇对象，调用簇实例的getDataPoints()方法即可读取簇内包含的所有原始点位
• React组件卸载时记得移除事件监听、清除图层，避免内存泄漏

参考实现代码：

import { useEffect } from 'react';

useEffect(() => {
  if (!map) return;

  // 初始化聚合数据源
  const dataPoints = points.map(
    point => new H.clustering.DataPoint(point.lat, point.lng, undefined, point),
  );
  const clusteredDataProvider = new H.clustering.Provider(dataPoints, {
    clusteringOptions: {
      eps: 32,
      minWeight: 2,
    },
  });

  // 配置图层主题
  const defaultTheme = clusteredDataProvider.getTheme();
  clusteredDataProvider.setTheme({
    getClusterPresentation: cluster => defaultTheme.getClusterPresentation(cluster),
    getNoisePresentation: noisePoint => defaultTheme.getNoisePresentation(noisePoint)
  });

  const clusterLayer = new H.map.layer.ObjectLayer(clusteredDataProvider);
  map.addLayer(clusterLayer);

  // 定义可见簇查询逻辑
  const queryVisibleClusters = () => {
    // 获取当前视口经纬度范围
    const currentViewBounds = map.getViewModel().getLookAtData().bounds;
    // 查询范围内的聚合结果
    clusteredDataProvider.requestBounds(currentViewBounds, (res) => {
      const visibleClusterList = [];
      res.groups.forEach(item => {
        // 过滤散点，仅保留聚合簇
        if (item.isCluster()) {
          visibleClusterList.push({
            clusterData: item,
            // 读取簇内所有原始点位
            containedPoints: item.getDataPoints()
          })
        }
      });
      // visibleClusterList 即为当前视口内可见的聚合簇数组
      console.log('可见簇数据：', visibleClusterList);
    });
  };

  // 绑定视图变化监听
  map.addEventListener('mapviewchangeend', queryVisibleClusters);
  // 初始加载时执行一次查询
  queryVisibleClusters();

  // 组件卸载时清理副作用
  return () => {
    map.removeEventListener('mapviewchangeend', queryVisibleClusters);
    map.removeLayer(clusterLayer);
  }
}, [map, points])

• 不要在getClusterPresentation中做可见性判断，该回调执行时簇尚未完成视口匹配，判断结果完全不可靠
• 若需要拖拽/缩放过程中实时更新结果，可将监听事件替换为mapviewchange，但该事件触发频率极高，建议搭配300ms左右的防抖使用，避免性能损耗
• requestBounds返回的结果会自动匹配当前地图缩放等级的聚合规则，不会返回其他缩放级别的预计算簇数据，不需要额外做层级过滤

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