1

threejs outline example: https://threejs.org/examples/#webgl_postprocessing_outline

I tried not to use FXAA in the example, for FXAA leads to poor resolution. But nothing was rendered after I'd removed FXAA codes, and no console information appeared.

Is FXAA a must when using outlinepass? How can I remove FXAA?

Hermann Cain
  • 11
  • 1

2 Answers2

2

Just setting outlinePass.renderToScreen = true does not work. Instead, you have to replace the FXAAPass with:

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

Demo: https://jsfiddle.net/f2Lommf5/5091/

three.js R91

Mugen87
  • 28,829
  • 4
  • 27
  • 50
  • it woks, thanks! The resolution is better without fxaa, but worse than that without postprocessing. Is it an inevitable result of outline pass? Or how can I fix it? – Hermann Cain Apr 12 '18 at 00:58
  • `EffectComposer` does not regard the device pixel ratio so far (see https://github.com/mrdoob/three.js/issues/12188). Besides, it's a WebGL1 limitation that you can't use MSAA with post processing. This will change with WebGL2. – Mugen87 Apr 12 '18 at 08:23
-1

Remove the FXAA pass (lines 295-298), and enable renderToScreen for the outlinePass : outlinePass.renderToScreen = true

With postprocessing, the last pass with the property renderToScreen enabled will be rendered on the screen.

Also, be careful not to enable renderToScreen at different passes !

Jérémie Boulay
  • 400
  • 4
  • 13