javascript - 三.JS r71 : Transparent renderer doesn't work with post-processing filters

标签 javascript three.js rendering webgl

我正在尝试在当前场景上渲染 BloomPass,并让背景从包含页面的正文中显示出来。但是,当应用 BloomPass 时,背景会变成黑色。

我的示例在这里: http://plnkr.co/edit/0mp0jaGVF6it52HY7aq2?p=preview

我尝试遵循这个相当旧的线程中的建议 https://github.com/mrdoob/three.js/issues/1080在我的本地版本的 plunkr 上(例如更改 RenderPass 中的 ClearAlpha 标志),但这些没有效果。无论我使用哪种着色器,这种黑色背景都会持续存在(也尝试使用 FilmPass 和 FXAA)

在 Yosemite 10.10.5 上运行 Chrome 45.0.2454.101(64 位)

最佳答案

如果您计划广泛使用 EffectComposer,您可能需要投入时间来完全理解它。其中有很多微妙之处。

您希望后处理效果是透明的。

为此,您需要确保 Composer 使用的渲染目标具有 Alpha channel - 即为 THREE.RGBAFormat

composer.renderTarget1.format = THREE.RGBAFormat;
composer.renderTarget2.format = THREE.RGBAFormat;
effectBloom.renderTargetX.format = THREE.RGBAFormat;
effectBloom.renderTargetY.format = THREE.RGBAFormat;

三.js r.73

关于javascript - 三.JS r71 : Transparent renderer doesn't work with post-processing filters,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33193948/

相关文章:

Java swing 渲染优化

javascript - 尝试使用 javascript 停止图像加载

javascript - 如何知道是否有Ajax Request和ajax Success

javascript - three.js:在添加到对象加载器加载的对象的着色器 Material 中使用纹理

javascript - 如何衡量单页应用程序中的客户端性能

python - ModernGL 设置统一

javascript - 如何将秒转换为 HH :mm:ss in moment. js

javascript - jquery 哈希如果没有哈希

three.js - 将 Raycaster 与正交相机结合使用

javascript - Three.js - 渲染问题 - 动画在晃动