three.js:如何在FXAAShader之后添加CopyShader (r58)

Question

在后处理中，我在FXAAShader之后添加了CopyShader，以便即使禁用了FXAA也能正确呈现(例如: webgl_postprocessing2.html)。

~

renderer.setSize( 320, 240 );  // not full screen

~

fxaa = new THREE.ShaderPass( THREE.FXAAShader );
fxaa.uniforms[ 'resolution' ].value = new THREE.Vector2( 1 / 320, 1 / 240 );
composer.addPass( fxaa );

var effect = new THREE.ShaderPass( THREE.CopyShader );
effect.renderToScreen = true;
composer.addPass( effect );

此代码不能很好地工作，并且渲染的图像比预期的要小。

我正在使用r58，并与Firefox20确认。我该怎么办？

Answer 1

THREE.EffectComposer.renderTarget的width和height必须与WebGLRenderer的匹配。

为此，您需要创建自己的renderTarget并将其传递给EffectComposer构造函数。

var parameters = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter,
                   format: THREE.RGBFormat, stencilBuffer: false };
var renderTarget = new THREE.WebGLRenderTarget( width, height, parameters );

composer = new THREE.EffectComposer( renderer, renderTarget );

小提琴：http://jsfiddle.net/uxeez/4/

three.js r.58