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

图层叠放顺序

两个半透明面图层叠在一起时,谁在上层由 zIndex 决定;数值大的压在上面,与加入地图的先后无关。

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

说明

蓝色面与橙色面共用一块重叠区域,各自 setZIndex() 取不同数值。 点击切换按钮后重新赋值,OpenLayers 会按 zIndex 排序重绘,无需把图层从 layers 数组里删除再加回来。底图固定为 zIndex: 0,业务层从 1 起算。

操作结果
点击「橙色置顶」重叠区域显示橙色,蓝色被压在下层
点击「蓝色置顶」重叠区域改为蓝色
查看顶部文字显示当前两层的 zIndex 值

缩放交互期间图层可能被复用,切换层级后建议调用一次 map.render() 确认画面已同步。