Is it possible to limit OutlineEffect to specific meshes?

Questions
1

Is it possible to restrict the effect of OutlineEffect to specific meshes?

2

Yes it should be, have you had a look at the official outline pass example?

3

you can also try postprocessing. jsm/EffectComposer is not maintained, runs very slow because it cannot glob passes into a single shader, it has tons of unaddressed shortcomings and glitches.

here’s an example of selective outlines in react-postpro Selective outlines - CodeSandbox and this is the vanilla implementation OutlineEffect | postprocessing

1 Like
4

Looking at the source code for OutlineEffect it doesn’t appear to use OutlinePass or have a selectedObjects array.

5

Thanks. One of these days I’ll try three-react-fiber

6

postprocessing is a vanilla library though. poimandres is more like a dev org, there are some react related things on it, but also many vanilla libs. the outline would work, you have selectedObjects or something on the effect pass. it’s generally a better alternative to jsm.

7

The OutlineEffect code that comes as part of the ThreeJS repo, creates a alternative material for each mesh in a scene. It has setOutlineMaterial and restoreOriginalMaterial methods. It uses traverse on the scene to switch materials. So I think my easiest solution is to write a custom render function rather than use OutlineEffect.render.

8

Ah I see, I didnt know about the OutlineEffect class and made an assumption that’s my bad, on inspection it does look like this.render would need to be modified which could include an array of objects to be passed into the function, otherwise you could have a secondary scene, the first would contain all none outlined objects and use renderer.render, the second would contain outlined objects and use Outline.render

1 Like
9

If anyone is interested my solution was to extend OutlineEffect to include an outlineGroup and replace the render method. The only change being the call to renderOutline uses the outlineGroup not scene which is assumed to be the root level scene object.

 class OutlineEffect2 extends OutlineEffect{
        constructor( renderer, outlineGroup ){
            super( renderer );

            this.outlineGroup = outlineGroup;

            this.render = function ( scene, camera ) {

                if ( this.enabled === false ) {

                    renderer.render( scene, camera );
                    return;

                }

                const currentAutoClear = renderer.autoClear;
                renderer.autoClear = this.autoClear;

                renderer.render( scene, camera );

                renderer.autoClear = currentAutoClear;

                this.renderOutline( outlineGroup, camera );

            };
        }
    }
1 Like