CODEWITHSUNDEEP
javascriptthree.jswebglshadow
Fez Vrasta
Fez Vrasta

Reputation: 14815

Three.js drop shadow

I was wondering if there's a way to project a shadow without have a "ground" plane where project it. I'd like to do that because the camera can be moved around the object and would be ugly see it pass through the ground.

I'm using Three.js latest-version with the WebGl renderer.

Upvotes: 0

Views: 3049

Answers (2)

Yash Soni
Yash Soni

Reputation: 26

Yes this is possible by applying ShadowMaterial to the plane geometry. This material can receive shadows and is completely transparent. so you just position the plane geometry at the desired location in the scene and you are good to go. check out this. https://threejs.org/docs/#api/en/materials/ShadowMaterial

Upvotes: 1

LJᛃ
LJᛃ

Reputation: 8123

This is technically impossible, you could write a shader that renders the shadow on a transparent plane, that way you would not notice it when the "camera" goes through the plane, only when it goes through the shadow itself.

To do so you can lerp between the shadowratio and a transparent black or white in the pixel shader and then set the corresponding blending states on the rendering context.

Upvotes: 1

Related Questions