经纬志
首页 / OpenLayers / 使用示例

点聚合

300 个点位在低缩放级别下会互相压盖。聚合把屏幕距离相近的点合并成一个圆, 圆上的数字就是被合并的数量,点进去还能继续放大。

OpenLayers 10.3.1 · 更新 2026-10-27
源码与运行效果
运行效果

说明

聚合源包住原始数据源,对外提供的不是原始要素,而是“聚合要素”。 每个聚合要素的 features 属性存着被合并的原始要素数组, 数量直接读 features.length。

参数含义示例取值
distance聚合半径,单位是屏幕像素滑块 20 – 100
minDistance两次重算之间的最小间隔20
geometryFunction自定义聚合点的位置默认取成员坐标平均值

distance 用的是像素而不是米,所以缩放地图时聚合结果会自动重算。 拖动滑块调用 clusterSource.setDistance(),无需重建数据源。

点击聚合圆的处理里用 map.forEachFeatureAtPixel 做命中测试, hitTolerance: 4 让边缘点击也能命中。 命中后把成员要素的范围合并,交给 view.fit 放大。

forEachFeatureAtPixel 的回调里返回 true 表示停止继续遍历。 漏掉这个返回值会让所有命中图层都被遍历一遍,回调被多次调用。