Cesium模型又暗又蓝?调完这几个参数我舒服了

1 阅读2分钟

最近在给Cesium项目做优化,加载3D Tiles模型后,我陷入了深深的自我怀疑——

这模型怎么又黑又蓝呢??

我怀疑过模型本身,怀疑过光照,甚至怀疑过我的显示器是不是坏了...

直到我发现,问题不在模型,而在Cesium的渲染参数。

今天就把我摸索出来的"去蓝提亮"组合拳分享给大家,全程只需改几个参数,效果立竿见影

具体效果如图所示: image.png

第一招:先把画面"稳住"(抗锯齿三件套)

我的解决方案是HDR + MSAA + FXAA 全家桶

const scene = viewer.scene;

// 开启HDR,让高光不糊成一片白,暗部更有层次
scene.highDynamicRange = true;

// MSAA 8倍采样,专治几何边缘锯齿(建筑轮廓、斜线)
scene.msaaSamples = 8;

// 伽马校正2.2,让明暗过渡更自然,符合人眼习惯
scene.gamma = 2.2;

// FXAA后处理抗锯齿,对付细碎高频锯齿(贴图细线、远处密集结构)
viewer.scene.fxaa = true;

人话解释:

  • HDR = 让画面有"动态范围",亮的地方能亮上去,暗的地方不死黑
  • MSAA = 给模型边缘做"磨皮"(几何层面)
  • FXAA = 给整个画面做"柔焦"(后处理层面)
  • 两者叠加,既保住细节又去掉了毛刺

💡 小提示:MSAA开太高会吃GPU,8是个比较甜的平衡点


第二招:干掉"天光蓝"(PBR环境光调色)

这是重头戏!Cesium默认的PBR光照,特别喜欢给你加"蓝色滤镜"——因为模拟了真实的大气散射,天光确实是偏蓝的,但我们做的是数字孪生,不是天气预报,不需要那么真实(且难看)的蓝色。

核心思路:保留亮度,干掉偏色

// 只保留环境漫反射,关掉环境镜面反射(减少镜面偏色)
tiles.imageBasedLighting.imageBasedLightingFactor = new Cesium.Cartesian2(1.0, 0.0);

const env = tiles.environmentMapManager;

// 1. 提亮整体环境光
env.brightness = 1.5;

// 2. ★ 关键:降低大气散射强度,这是"发蓝"的罪魁祸首!
env.atmosphereScatteringIntensity = 1.0; 

// 3. 把环境光"去色",进一步抑制偏色
env.saturation = 0;

// 4. 改地面回光颜色:从默认的偏绿/土色 → 中性浅灰白
// 这样模型底部暗部不会染上奇怪的颜色
env.groundColor = Cesium.Color.fromBytes(230, 230, 230);

第三招:我的调参顺序建议

别一次性改一堆,建议按这个顺序来,方便定位问题:

  1. 先开HDR + gamma → 看明暗层次是否舒服
  2. 加MSAA + FXAA → 看边缘是否还锯齿
  3. 调 brightness → 解决"不够亮"
  4. 降 atmosphereScatteringIntensity → 解决"发蓝"
  5. 降 saturation + 改 groundColor → 微调至"展厅级"质感

最终效果总结

用这套组合拳后,我的模型从灰蓝色变成了 "明亮干净的展厅效果"

更亮 —— brightness提升,不再灰蒙蒙
更白 —— 干掉大气蓝,白墙就是白墙
更稳 —— MSAA+FXAA,边缘不毛躁
更干净 —— 中性groundColor,暗部不染色

(备注:cesium版本是1.135)


image.png