[Solved] Toon Shading no shadows

Hi there, newbie to the forum so sorry if old quesiton
I’ve spent days trying to get a decent toon shader work on my obj models to no avail and trying to make the best i can with the standard toon shader, im totally new to threejs relatively so im probably doing something super wrong

(you can drag around)
I cant get any shadows to appear on the toon shader, its the closest i got to getting a 2d look(and i cant embed my obj model you see on the code sadly) but they just wont cast shadows or have any other look apart from flat.

Is it possible for the toon shader to cast a shadow?
Or to have a cell shaded half gray point between light and shadow?
And am i applying the material the mest way to the obj the way i’m doing it now?

07%20PM
Another example with a different light setup from the codepen but again no shadows, same material

I’m trying to use the toon shader as a way to save on material loading and having a low filesize :slight_smile:

Thank you in advance for any help!

Here is a version with shadows: https://codepen.io/anon/pen/oVWNQK

A few bits were missing in your code:

  • You have to enable shadow maps by setting renderer.shadowMap.enabled to true.
  • Just a HemisphereLight does not cast shadows. I have added an additional directional light.
  • You also have to set Object3D.castShadow and Object3D.receiveShadow correctly, otherwise no objects will cast or receive shadow.
3 Likes

Nice!! Thanks dude! Works great, thank you for the helper idea too! I didn’t know about that object type, helps a lot.
But when I apply the castShadow to the obj model its still not casting shadow, are obj models treated differenty?
var loader = new THREE.OBJLoader( );
loader.load( ‘model/Pug_min.obj’, function ( obj ) {
obj.traverse((node) => {
if (node.isMesh) {
node.material =toonMaterials[1];
node.castShadow = true;
}
});
model_object = obj;
model_object.scale.copy(new THREE.Vector3(0.06, 0.06, 0.06))
model_object.position.set(0, 150, -500);
scene.add(model_object);
});

can be simplified to:
model_object.scale.setScalar(0.06)

2 Likes

Um, I don’t see something wrong at your code. Can you please ensure that your model is inside the shadow frustum of the directional light?

2 Likes

Thanks to both of you! You were right Mugen i had the model too far away, and thanks for the setScalar function prisoner :slight_smile:

1 Like