Three.js结合了StereoEffect和FXAA ShaderPass

Question

我已经使用Three.js StereoEffect创建了Google Cardboard场景

effect = new THREE.StereoEffect(renderer);
effect.render(scene, camera);

现在，我想通过FXAA Shader运行它以平滑输出。 我知道我可以使用EffectComposer做到这一点：

renderScene = new THREE.RenderPass(scene, camera);
effectFXAA = new THREE.ShaderPass(THREE.FXAAShader);
effectFXAA.uniforms['resolution'].value.set(1 / (window.innerWidth * dpr), 1 / (window.innerHeight * dpr));
effectFXAA.renderToScreen = true;

composer = new THREE.EffectComposer(renderer);
composer.setSize(window.innerWidth * dpr, window.innerHeight * dpr);
composer.addPass(renderScene);
composer.addPass(effectFXAA);
composer.render();

这样可以使图像平滑，但是我无法确定如何将其与StereoEffect视图结合使用。

Answer 1

在对我自己的项目进行了相同问题的研究和试验后，我发现EffectComposer和StereoEffect混合得不好。 他们都试图在管线的同一级别上渲染场景。 一个不会流过另一个。

我的解决方案是创建一个新类，从StereoEffect更改为StereoCamera。 没有效果的情况几乎相同，而是返回要由EffectComposer（或其他效果）渲染的相机。

您可以在此处找到StereoCamera类 ，并在此处找到完整的工作示例 。

由于这有助于我前进（如果这个问题不太老，也许您可​​以），所以我提交了pull请求，以将类和示例与其他three.js示例一起添加，以希望对其他人有所帮助。

===

更新：事实证明，其他一些人最近也首先解决了这个问题。 请参阅此拉取请求以及另一个更优化的StereoCamera类 。