Improve ShadowMesh.js and Prevent Shadow Overlap (#24180)

A simple use of the stencil buffer can prevent ugly artifacts caused by the planar projected shadow of the geometry overlapping with itself.
mrdoob · Jun 3, 2022 · ca5f97c · ca5f97c
1 parent cba85c5
commit ca5f97c
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/examples/jsm/objects/ShadowMesh.js b/examples/jsm/objects/ShadowMesh.js
@@ -1,7 +1,9 @@
 import {
 	Matrix4,
 	Mesh,
-	MeshBasicMaterial
+	MeshBasicMaterial,
+	EqualStencilFunc,
+	IncrementStencilOp
 } from 'three';
 
 /**
@@ -19,7 +21,11 @@ class ShadowMesh extends Mesh {
 			color: 0x000000,
 			transparent: true,
 			opacity: 0.6,
-			depthWrite: false
+			depthWrite: false,
+			stencilWrite: true,
+            		stencilFunc: EqualStencilFunc,
+            		stencilRef: 0,
+            		stencilZPass: IncrementStencilOp
 
 		} );