首页 / deck.gl / 使用示例
三维柱状
十八乘十八共三百二十四根柱体排成阵列,高度由三个高斯峰叠加而成。 拖动倍率滑杆或重算分布,柱体的高低关系随之改变。
源码与运行效果
说明
阵列间距 0.0052 度,在本地纬度上约合 440 米;柱体半径 190 米,
覆盖率 0.84,柱与柱之间留出明显缝隙。高度不直接给米数,
而是先归一化到 0–1,再乘 elevationScale,
这样倍率滑杆才有一致的视觉效果。
| 配置 | 作用 |
|---|---|
diskResolution: 16 | 底面 16 边形,肉眼已接近圆柱 |
getElevation | 返回 0–1 的强度,与倍率解耦 |
elevationScale | 100–1600 米之间调节整体高度 |
coverage: 0.84 | 柱体直径占阵列间距的比例 |
material | 斜视角下侧面的明暗对比 |
为什么用归一化高度
若 getElevation 直接返回真实米数,数据一换、
量级一变,就要重新设定 elevationScale。
归一化之后,数据与视觉参数分离,同一个倍率下不同数据集的
相对结构仍然可读。
重算分布会同时移动三个高斯的中心偏移,柱体高低重新排列, 但图层 id 与坐标不变。这类整体替换数据的场景, deck.gl 会重新上传顶点,切换瞬间有轻微停顿,属于正常现象。
倾斜角决定信息量。俯仰角低于 25 度时柱体几乎退化为色块, 高于 70 度时远处柱子被压缩得难以比较。示例用 54 度, 既能看清高度,也能分辨阵列的行列。