Three.JS r71：透明渲染器不適用於后期處理濾鏡

Question

我正在嘗試在當前場景上渲染BloomPass，並從包含頁面的正文中顯示背景。 但是，當應用BloomPass時，背景變為黑色。

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

我嘗試在本地版本的plunkr上按照以下相當舊的線程中的建議在https://github.com/mrdoob/three.js/issues/1080 （例如，在RenderPass中更改ClearAlpha標志），但是這些無效。 無論我使用哪種着色器，此黑色背景也會持續存在（也與FilmPass和FXAA一起嘗試過）

在優勝美地10.10.5上運行Chrome 45.0.2454.101（64位）

Answer 1

如果計划廣泛使用EffectComposer ，則可能需要花費時間來完全理解它。 有很多微妙之處。

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

為此，您需要確保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