Is there a MeshNormalMaterial somewhere that shines with light and receives shadow? That’d be cool to use for nice-looking defaults. I tried Three’s MeshNormalMaterial but it doesn’t receive lighting (unless I did something wrong).
No, you did everything correct .
MeshNormalMaterial does not react on lights. It just maps normal vectors to RGB colors. But you can apply the effect to your custom materials with this code.
// assuming normal is vec3 vec3 rgb = normalize( normal ) * 0.5 + 0.5;
Or include the shader chunk
packing in your fragment shader and use the function
Thanks @Mugen87. I have no experience modifying or making custom shaders in Three. How would I apply
vec3 rgb = normalize( normal ) * 0.5 + 0.5;? How would I include the packing chunk? Which is easier? Do you have a small example?
Maybe this shader is a good example. You see in the fragment shader how the chunk
common is included. After that, it’s possible to use the function
linearToRelativeLuminance() in the code.
Let’s say you have developed your shader program. If you want to use it in your
three.js app as a material, you have to create an instance of
RawShaderMaterial with your shader code. The following official example illustrates this workflow:
Also check the docs for more information.
Okay, maybe later I’ll try this. I don’t have my own shader program. Which seems easier? Copying MeshNormalMaterial’s shader and adding the lighting/shadow bits, or copying another shader (phong?) and adding the packing bits?
Try the latter approach first.