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

标注避让

150 个编号标注挤在同一个区域,默认只画出互不遮挡的那部分。 勾选「允许重叠」后全部绘出,顶部数字实时对比两种策略的差异。

MapLibre GL JS 4.x · 更新 2026-10-28
源码与运行效果
运行效果

说明

符号图层默认开启碰撞检测:后绘制的标注如果与已绘制的重叠,就会被跳过。 这也是低缩放时地名会「消失」的原因,不是数据没加载。

统计用 queryRenderedFeatures({ layers: ['labels'] }), 它只返回当前真正绘出的要素。调用要等 idle, 布局还没稳定时数量偏少。

属性取值效果
text-allow-overlapfalse重叠时隐藏后绘制的标注
text-ignore-placementfalse是否独占碰撞盒
text-padding2标注周围留白,越大越易被跳过
text-size12字号变大,可容纳的标注变少

text-allow-overlap 与 text-ignore-placement 要一起改。 只开前者时,标注仍会占用碰撞盒,视觉上互相压字且排序混乱。

需要按优先级显示标注时,用 symbol-sort-key 指定排序, 重要要素先绘制,就能在同样的空间里留下更关键的名字。