Three.JS r71：透明渲染器不适用于 post-处理过滤器

Question

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

My example is here:http://plnkr.co/edit/0mp0jaGVF6it52HY7aq2?p=preview

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

运行 Chrome 45.0.2454.101（64 位）在 Yosemite 10.10.5

Answer 1

如果您打算广泛使用 EffectComposer，您可能需要花时间来完全理解它。有很多微妙之处。

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

为此，您需要确保 Composer 使用的渲染目标具有 alpha 通道——即 THREE.RGBAFormat.

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

three.js r.73

Three.JS r71：透明渲染器不适用于 post-处理过滤器

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

javascript

rendering

webgl

three.js