屏幕空间雾效果

通过 ScreenSpaceFogEffect 可以为场景添加全屏高度雾效果。

 import { PostprocessingRenderPipeline, ScreenSpaceFogEffect } from '@tx3d/postprocessing';

 // 获取场景渲染器
const { sceneRenderer } = engine;

// 获取后处理渲染管线
const renderPipeline = sceneRenderer.renderPipeline as PostprocessingRenderPipeline;

// 创建屏幕空间雾后处理效果
const screenSpaceFogEffect = new ScreenSpaceFogEffect( {
    
    fogColor: '#F0F8FF',
    fogDensity: 0.05,
    fogHeight: 50.0,
    fogHeightFalloff: 0.025,
    fogMaxOpacity: 0.95,
    fogStartDistance: 10,
    noiseStrength: 0.05,
    noiseScale: 0.001,
    noiseSpeed: new Vector2( 0.05, 0.05 ),
    inscatteringLightDirection: new Vector3( -50, -50, -50 ).normalize(),
    directionalInscatteringExponent: 8.0,
    directionalInscatteringColor: '#F0F8FF'

} );

提示

ScreenSpaceFogEffect初始化参数，详见ScreenSpaceFogEffectOptions。

属性

🌏 fogColor 雾气的颜色。雾气最浓处（无限远或低空）的颜色。它会和场景颜色混合。通常设置为天空、环境光或场景的主色调。例如，白雾用 vec3(1.0, 1.0, 1.0)，黄昏时用偏暖的颜色。

// 设置雾气颜色
screenSpaceFogEffect.fogColor = '#F0F8FF';

🌏 fogDensity 雾气的基础密度。控制雾气的整体浓度。密度越大，雾越浓，遮挡越快。通常在 0.01 到 0.5 之间。越小雾越稀薄。

// 设置雾气密度
screenSpaceFogEffect.fogDensity = 0.025;

🌏 fogHeight 雾气层的基准高度。定义世界坐标 Y 轴上雾气密度最高的水平面。应设置为您场景中地面、水面或云层底部的 Y 坐标（例如 0.0）。

// 设置雾气高度
screenSpaceFogEffect.fogHeight = 25;

🌏 fogHeightFalloff 雾气的高度衰减系数。控制雾气密度随 Y 轴升高而衰减的速度。值越大，雾层越薄，边界越清晰。通常在 0.05 到 1.0 之间。0.05 适合厚厚的、缓慢过渡的大气，0.5 适合贴地面的薄雾。

// 设置雾气高度衰减系数
screenSpaceFogEffect.fogHeightFalloff = 0.015;

🌏 fogMaxOpacity 雾气的最大不透明度。限制雾气在无限远处（或最大密度处）的透明度。避免雾气完全遮盖场景。0.0 (完全透明) 到 1.0 (完全不透明)。推荐设置 0.9 到 0.99，以保留远景的微小细节。

// 设置雾气的最大不透明度
screenSpaceFogEffect.fogMaxOpacity = 0.95;

🌏 fogStartDistance 雾效开始计算的距离。定义雾效从距离相机多远的位置开始生效。这有助于避免近处物体受到雾气影响，也常用于控制性能。0.0 (相机前即开始) 到 10.0 (距离相机 10 个单位后开始)。

// 设置雾气的开始计算距离
screenSpaceFogEffect.fogStartDistance = 10;

🌏 inscatteringLightDirection 定向光的反向方向向量。定义光的来源方向。通常设置为定向光光源方向的负值，且必须归一化 (normalize)。例如，如果光从正上方射下，方向是 Vector3(0, -1, 0)，则此参数应为 Vector3(0, 1, 0)。

// 设置雾气定向光方向
screenSpaceFogEffect.inscatteringLightDirection = new Vector3( -10, 0.0, -10 ).normalize();

🌏 directionalInscatteringColor 散射光的颜色。控制光束的颜色和强度。通常与太阳光的颜色相匹配，例如偏黄或偏白。

// 设置雾气散射光的颜色
screenSpaceFogEffect.directionalInscatteringColor = '#F0F8FF';

🌏 directionalInscatteringExponent 散射光束的聚焦指数。控制光束的锐利程度。值越大，光束越集中、越锐利。1.0 到 3.0 之间是常见设置。

// 设置雾气散射光束的聚焦指数
screenSpaceFogEffect.directionalInscatteringExponent = 3.0;

🌏 directionalInscatteringStartDistance 散射光束开始计算的距离。类似于 fogStartDistance，但只针对散射光。通常设置为大于 fogStartDistance 的值，以避免光束在相机附近出现。

// 设置雾气散射光束开始计算的距离
screenSpaceFogEffect.directionalInscatteringStartDistance = 0.0;

🌏 noiseStrength 噪声对雾气基准高度的最大扰动幅度。控制雾气基准面上下波动的最大高度（米）。通常设置为一个世界高度值，如 5.0 (轻微波动) 到 50.0 (明显起伏)。这个值决定了雾气团块的垂直对比度。

// 设置雾气扰动噪声强度
screenSpaceFogEffect.noiseStrength = 5.0;

🌏 noiseScale 噪声在世界空间中的频率。控制雾气团块的大小。值越小，团块越大越平缓；值越大，团块越小越密集。大型云海推荐 0.005 到 0.05。地面团状雾推荐 0.05 到 0.15。

// 设置雾气扰动噪声频率
screenSpaceFogEffect.noiseScale = 0.001;

🌏 noiseSpeed 雾气扰动在世界空间 X 轴和 Z 轴上的流动速度。控制噪声纹理随时间推移的平移速率。x 分量控制 X 轴流动，y 分量控制 Z 轴流动。 通常设置小数值： Vector2(0.01, 0.0)：表示雾气以 0.01 的速度沿世界 X 轴稳定流动。 Vector2(0.0, -0.05)：表示雾气以 0.05 的速度向世界 Z 轴负方向快速流动。 Vector2(0.0, 0.0)：表示雾气完全静止（像静态云）。

// 设置雾气扰动速度
screenSpaceFogEffect.noiseSpeed = new Vector2( 0.025, 0.015 );