OutlinePass doesn't properly work while animation?


Why OutlinePass doesn’t work correctly while animation? Is this an issue or restriction for OutlinePass? It outlines always only static state of an object but not animated…
Here is an screenshot of webgl_skinning_simple example:

Yes. More information here: https://github.com/mrdoob/three.js/pull/18427

1 Like

Thank you for your answer and solution! Great! I’ve realized it (skinned=true param is needed for correct outline) while playing with second material for a mesh (read it in some of your posts) and made outline not the same but similar (may be it is better for performance way instead of OutlinePass):

let cloneMat = material.clone();
cloneMat.onBeforeCompile = ( shader ) => {
    shader.uniforms['offset'] = {value: 0.01};
    shader.vertexShader = shader.vertexShader.replace(
                '#define STANDARD',
                `#define STANDARD
                uniform float offset;
                '#include <project_vertex>',
                `#include <project_vertex>
		        vec4 pos = vec4(transformed + normal*offset, 1.0);
		        pos = modelViewMatrix * pos;
		        gl_Position = projectionMatrix * pos;
   shader.fragmentShader = shader.fragmentShader.replace(
		'#include <fog_fragment>',
		`#include <fog_fragment>
	  	 gl_FragColor = vec4( 1.0, 1.0, 0.0, 1.0 );
cloneMat.side = THREE.BackSide;
material.side = THREE.FrontSide;
cloneMat.depthWrite = false;
cloneMat.depthTest = true;
geometry.addGroup(0, Infinity, 0);
geometry.addGroup(0, Infinity, 1);
mesh = new THREE.SkinnedMesh(geometry,[cloneMat, material]);

I’m not good at shaders programming… but I bealive somehow very thin lines or just pixels can be removed or smoothed with near colors to make it look more comfortable way: