shadow
The shadow node encapsulates the complex logic of standard shadow mapping, making it easy to add shadows from standard scene lights (like DirectionalLight, SpotLight) to custom TSL materials. It simplifies shadow calculations by outputting a shadow factor.
Core Advantages
It greatly simplifies the process of implementing shadows in custom materials, eliminating the need for users to understand the underlying GLSL details of shadow maps, depth comparison, or PCF filtering. It seamlessly inherits the shadow settings of Three.js lights, ensuring consistent behavior with standard materials.
Common Uses
Adding realistic shadows to custom TSL materials
Creating stylized shadow effects (e.g., cel-shading or colored shadows)
Calculating and blending shadows from multiple light sources in a scene
How to adjust
The node's effect is adjusted entirely by configuring the `.shadow` property of its associated `THREE.Light` object in JavaScript. Key properties include: `shadow.bias` to fix shadow acne, `shadow.radius` to create soft shadow edges, and `shadow.mapSize` to control the shadow map's resolution, balancing quality and performance.
Code Examples
1// Get the shadow factor for the light (0.0 = full shadow, 1.0 = fully lit)
2const shadowFactor = shadow( dirLight );
3
4// Multiply the color by the shadow factor
5material.colorNode = baseColor.mul( shadowFactor );