首页 / MapLibre / 使用示例
线图层
一条线路三层画法:深色描边打底、渐变主线表示进度、虚线区分规划段。 线宽滑块同时改主线与描边,保持比例。
源码与运行效果
说明
渐变依赖 lineMetrics: true。开启后源会额外计算沿线距离,
line-progress 才能作为插值输入。忘记这个开关时,
渐变表达式不生效,线显示为单色。
描边不是 line-width 的描边属性,而是另一条更宽的线压在下面。
三段式线宽(底宽、主宽、端点样式)都各自声明,图层顺序决定谁在上。
| 配置 | 取值 | 说明 |
|---|---|---|
lineMetrics | true | 渐变与沿线距离的必要条件 |
line-gradient | line-progress 插值 | 按里程变色 |
line-dasharray | [2, 1.5] | 虚线节奏,单位线宽 |
line-cap | round | 端点为圆头,接头更顺 |
line-join | round | 折角圆滑,避免尖刺 |
线宽以像素为单位,缩放时不会自动变化。需要随级别加粗时,
把 line-width 写成 interpolate 表达式,
而不是在 zoomend 里改数值。
虚线在急转弯处会断裂,这是 dasharray 按线长均匀切分的必然结果。 接缝要求高时改用实线,或用符号图层沿线摆放点段。