用途:在 React Three Fiber 场景中实现泛光(Bloom)与辉光效果,基于 Three.js 的 UnrealBloomPass,通过 @react-three/postprocessing 的 Bloom 与 SelectiveBloom 组件使用。
主要能力:支持亮度阈值泛光、选择性对象泛光、多对象选择泛光、动画强度、音频驱动强度,以及自发光材质配合。核心参数包括 luminanceThreshold(0-1,亮度阈值,越低辉光越多)、luminanceSmoothing(0-1,阈值过渡柔和度)、intensity(0-10,亮度倍数)、radius(0-1,模糊扩散)、levels(1-9,模糊质量/迭代次数)。
使用方式:安装依赖 npm install three @react-three/fiber @react-three/postprocessing,在 Canvas 内用 EffectComposer 包裹 Bloom 组件并设置参数。选择性泛光可用 SelectiveBloom 配合 ref,或用 Selection/Select 包裹多个对象。自发光材质需设置 emissive、emissiveIntensity 大于 1 且 toneMapped={false}。
适用场景:宇宙辉光、霓虹赛博朋克、时间倒计时等视觉风格,以及需要局部发光或动态脉冲的 3D 界面。
限制与优化:性能问题可减少 levels、启用 mipmapBlur、关闭 multisampling;移动端可按 GPU 分级降低参数。常见问题:无泛光需检查自发光强度与 toneMapped;泛光过弱可降低阈值并提高强度;泛光溢出可提高阈值。资料未提供收费、平台与效果保证等信息。