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

分级聚合

聚合点不只是把数字加起来,簇内要素数量可以驱动半径与配色,让密集程度一眼可见。

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

说明

ol.source.Cluster 把距离小于 distance 的点合成一个要素, 合成后的要素用 get('features') 取回组内原始要素数组。 样式函数按数组长度分三档:10 个以下小蓝点、30 个以下橙点、更多则红点并放大半径。 singleclick 命中聚合点时调用 view.fit 放大到该簇范围。

操作结果
缩小地图聚合点合并,颜色逐步升级
放大地图聚合拆散,露出单个灰点
点击带数字的聚合点视图放大到该簇覆盖范围

distance 的单位是像素,改缩放级别时聚合结果会自动重算,无需手动刷新数据源。