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

点云的三套配色方案

点云最怕糊成一团。换配色是最快的解法:渐变看高程,分档看类别,单色看几何。

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

这个示例在做什么

同一片点云,每 2.5 秒换一套配色:高度连续渐变、高度三档分色、单色。 右上角显示当前样式名。三套都由函数实现,输入点的高度、输出颜色。

点云样式的表达式通常写成 color: "color('red', 0.5)" 或 "${Classification}",本质同样是「属性到颜色」的映射。 连续渐变适合看高程分布,分档适合看分类,单色适合看清几何细节。

关键接口

接口作用
Cesium3DTileStyle点云样式的正式入口,支持表达式
color('…', alpha)样式表达式里的取色函数
PointPrimitive.color逐点改色的底层属性
Color.fromHsl连续渐变最省事的构造方式

可以直接改的地方

位置改什么效果
styles 数组增加一套多一种配色方案
o.z > 26改阈值分档高度变化
0.62 - (o.z/40)*0.5改色相范围渐变从冷到暖的跨度
setTimeout(apply, 2500)改间隔切换速度

替代说明:官方示例用样式表达式给 ion 点云换装。 这里把表达式换成 JavaScript 函数,映射关系一致;真实数据直接写 tileset.style 即可。