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

影像图层顺序控制

三个图层分别是蓝色 4×4 网格、橙色 8×8 网格、瓦片行列号。 调整顺序、切换显隐、拉动整体透明度,都能立刻看到合成结果的变化。

CesiumJS 1.121 · 更新 2026-10-27
源码与运行效果
运行效果

索引就是层序

viewer.imageryLayers 是一个有序集合,索引 0 在最下面。 raise 把图层往上挪一格,lower 往下挪一格, 变化后下一次渲染立即生效,不需要重建场景。

面板里列表的显示顺序是反过来的 —— 最上面一行对应索引最大的图层, 也就是用户眼里的「最上层」。点 ↑ 实际调用的是 raise。

为什么这些图层不需要网络

GridImageryProvider 和 TileCoordinatesImageryProvider 都是程序化生成瓦片,不发请求。前者按 cells 在每块瓦片里画网格, 后者把瓦片的 z/x/y 直接画在瓦片中央。

这类图层有两个实际用途:排查自建瓦片服务的行列号是否颠倒、验证 rectangle 限制是否生效。接入真实底图之后把它们隐藏即可。

可调参数

位置改什么效果
每行的 ↑ ↓调整索引层序变化,重叠区域的混色关系跟着变
每行的「隐藏」切换 layer.show只隐藏不销毁,随时恢复
gridLayer 的 alpha0.55 / 0.45 调低下层更容易透出来
cells4 与 8 互换网格疏密变化
整体透明度滑杆0 到 1按比例缩放每层的原始 alpha

删除图层要传第二个参数。imageryLayers.remove(layer) 只是从集合里摘掉,纹理和已下载的瓦片不会释放。 反复增删图层时显存会一直涨,正确写法是 remove(layer, true)。

真实底图的排序规则

业务上常见的组合是「卫星影像在最下、路网标注在中、业务热力在最上」。 排序原则是按信息密度递增:底层提供背景,上层提供标注和专题内容。 把两个不透明影像层叠在一起没有意义,上层会完全盖住下层, 要么给上层设透明度,要么改用卷帘对比。