0

What is the current solution in r136 to blend lights, shadows and color in a ShaderMaterial ? I already found the solution for the fog support.
I found some examples in previous revision (r108) like this codesandbox.

Actually, I'm looking for this kind of result : codesandbox.
Should I copy MeshPhongMaterial shaders as code base for my own shaders ?

The usage of custom shaders is mandatory in my projects, that's why i'm not using built-in materials.

Any idea or example ?
Thanks !

Sufhal
  • 13
  • 1
  • 5

1 Answers1

1

This question is huge, and does not have a single answer. Creating lights, shadows, and color varies from material to material, and includes so many elements that it would require a full course to learn.

However, you can look at the segments of shader code used by Three.js in this folder called /ShaderChunk. If you look up "light", you'll see shader segments (or "chunks"), for each material, like toon, lambert, physical, etc. Some materials need parameters to be defined at the beginning of the shader code, (those are the _pars files), some are calculated in the vertex shader, some in fragment, some need to split the code between _begin and _end, etc:

enter image description here

Shadows are even more complex because they require a separate render pass to build the shadowmap. Like I said, re-building your own lights, shadows, and color is a huge undertaking, and it would need a full course to learn. I hope this answer at least points you in the right direction.

M -
  • 26,908
  • 11
  • 49
  • 81
  • No doubt, it's good to know what chunk is what. It helps to understand what part of what shader (vertex or fragment, or both) to change, using `.onBeforeCompile()`, when you add features you want, keeping the rest of shader functionalities (lighting, for example) intact. – prisoner849 Jan 19 '22 at 07:06
  • Thanks for replies ! So you recommand to copy the entire built-in material and modify what I need ? If I understand well, an other way is to modify the texture color by using `onBeforeCompile()` callback to avoid creating my own material and implementing the whole complex logic of lights/shadow ? Another solution i'm currently taking in consideration is having 2 mesh, 1 transparent phong material for lights/shadow and another shader material behind with textures calculation. What do you think ? I'm actually looking for best practices in that case – Sufhal Jan 19 '22 at 08:49