Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve ShadowMesh.js and Prevent Shadow Overlap #24180

Merged
merged 1 commit into from
Jun 3, 2022
Merged

Conversation

N8python
Copy link
Contributor

@N8python N8python commented Jun 2, 2022

A simple use of the stencil buffer can prevent ugly artifacts caused by the planar projected shadow of the geometry overlapping with itself.

No Stencil Buffer:
Screen Shot 2022-06-02 at 1 06 14 PM

Stencil Buffer:

Screen Shot 2022-06-02 at 1 06 36 PM

This change makes shadowmeshes a viable technique to use for games in which shadowing is simple and only desired for a few dynamic objects, at virtually no cost to the ease of use of the class.

A simple use of the stencil buffer can prevent ugly artifacts caused by the planar projected shadow of the geometry overlapping with itself.
@mrdoob mrdoob added this to the r142 milestone Jun 3, 2022
@mrdoob mrdoob merged commit ca5f97c into mrdoob:dev Jun 3, 2022
@mrdoob
Copy link
Owner

mrdoob commented Jun 3, 2022

Thanks!

@erichlof
Copy link
Contributor

erichlof commented Jul 2, 2022

@N8python Thank you for improving this! It has been so many years since I contributed ShadowMesh that I had almost forgotten about it - in fact, I wasn't even aware of this PR or it being merged until I happened to see the name 'ShadowMesh' mentioned on the r142 release changes here .

I must confess that I was aware of the overlapping problem back when I first implemented it, but I didn't know (and still didn't until now - thanks!) how to fix it. It's so cool that your fix is only a handful of lines of code added, and that it uses an OpenGL/WebGL built-in Stencil operation - lovin' it!

Also from many moons ago, here was my first use-case for the ShadowMesh feature: pixel-perfect shadows for the light cycles and energy walls in my Tron clone, without shadow maps -> old 3dLightCycles demo

I might have to revisit this now that you have greatly improved the feature! Thank you again for your contribution and thanks @mrdoob for merging! :)
-Erich

abernier pushed a commit to abernier/three.js that referenced this pull request Sep 16, 2022
A simple use of the stencil buffer can prevent ugly artifacts caused by the planar projected shadow of the geometry overlapping with itself.
snagy pushed a commit to snagy/three.js-1 that referenced this pull request Sep 21, 2022
A simple use of the stencil buffer can prevent ugly artifacts caused by the planar projected shadow of the geometry overlapping with itself.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants