Skip to content

Latest commit

 

History

History
15 lines (9 loc) · 1.21 KB

README.md

File metadata and controls

15 lines (9 loc) · 1.21 KB
Raw

Rendering outlines in ThreeJS

This is the ThreeJS implementation of How to render outlines in WebGL. See a live demo.

This contains two implementations: v1 uses the depth & normal buffer. v2 uses the depth & "surface ID" buffer. See Better outline rendering using surface IDs with WebGL for an explanation of the v2 technique.

To run this locally, run npm install and npm run dev in this directory.

The post process code is in CustomOutlinePass.js.

Some notes to be aware of:

  • There's additional debug code/uniforms set up for debug visualization of the various inputs to the effect. This should be removed when using it in a real project.
  • The FXAA pass may not be needed if we can use a THREE.WebGLMultisampleRenderTarget which allows us to use the browser's antialiasing. Note you may need to work around this known issue: mrdoob/three.js#18876.