ThreeJS后期处理,混合效果作曲家通过

时间:2016-07-07 23:39:02

标签: three.js webgl post-processing

我试图想象如何在ThreeJS中使用EffectComposer。

尝试将运动模糊应用于网格,同时保持背景网格清晰。

我能够让它发挥作用的唯一方法是通过重叠前面元素的背景来减少深度:

http://code.michael-iriarte.com/post-process-test/test-1.html

但我希望能够呈现更像这样的东西(但运动模糊):

http://code.michael-iriarte.com/post-process-test/test-2.html

请参阅以下两个示例:

test 1 and 2

composerBack.addPass( renderBack );

composerFront.addPass( renderFront );
composerFront.addPass( renderMaskInverseFront );
composerFront.addPass( effectHBlur );
composerFront.addPass( effectVBlur );
composerFront.addPass( clearMask );

composerMerge.addPass( rttPassBack );                    
// composerMerge.addPass( renderMaskInverseBack );
composerMerge.addPass( renderMaskFront );
composerMerge.addPass( rttPassFront );
composerMerge.addPass( clearMask );

composerMerge.addPass( effectCopy);

非常欢迎对该主题提供一些帮助!

1 个答案:

答案 0 :(得分:0)

嗯,在Stackoverflow上跟自己说话有点奇怪:)

我失踪的是:

rttPassFront = new THREE.TexturePass( composerFront.renderTarget2.texture );   
rttPassFront.material.transparent = true;

在此处观看演示:

http://code.michael-iriarte.com/post-process-test/solution-1.html

我希望它可以帮助别人。如果您有不同的方法,请分享!!