Using a different (low poly) mesh for shadows?

Hi all,
I was wondering if there’s a way to tell THREE to use a different mesh for the shadow pass? Ie having high-quality model for the rendering itself, and a low-poly model just for the shadow, since its just the edges that count in most cases.

Thanks

1 Like

good question, did you try empty material?

1 Like

Empty material where? On the mesh casting the shadow?
Thanks,

Yes. I have no idea if this will work, however. Another option would be colorWrite : false

I believe shadowmaps use depth values, not colors, so it should be possible to have invisible meshes casting sadows.
I dont think there is a ready-to-use mechanism for mesh-shadow-swapping, so you will probably have to create and manage both models yourself.
In regards to making such object, I tested some material values and found 3.js ways to do it:

  1. transparent: true, opacity: 0
  2. transparent: true, colorWrite: false
  3. alphaTest: 3. (Actually any value greater than 1 will do the trick. In the shader chunk code you can see that any pixel with alpha value below ALPHATEST will be discarded and opaque values are 1 by default)

As far as which one is best… Im not sure :sweat_smile:
I would guess 3 - 2 - 1 is the most to least efficient due to alpha blending being pretty costly, but I can be wrong. Would love to hear an expert’s opinion on this.

ok, but you dont want to write to depth in the normal pass because the high poly version will be erased, no?

Tested all 3 and it doesn’t occlude any objects

Definitely not^^. The scene is rendered with the more or less cheap MeshDepthMaterial or MeshDistanceMaterial.

WebGLShadowMap does not support any form of LOD-mechanism for generating shadows.

1 Like

I’ve added a callback in the renderObject function in WebGLShadowMap.js so scene objects like IndexedVolume can take over the render calls. Instanced impostors for shadows gave me a huge performance boost especially with CSM on a massive distance for vegetation (forests, bushes etc) preserving the silhouette details with minimal cost.

2 Likes

maybe if they are sorted into the end of rendering queue? because I would expect some artifacts like this: https://jsfiddle.net/0me2bua4/

Not the exact answer you’re looking for but do you think a different shadow map system might help.

CSM just uses a directional light per cascade, the way it’s rendered is the same as regular lights, btw CSM is actually added to the latest release of THREE now with major improvements (as module).

2 Likes