I've just finished porting of my first cloth simulation from opengl to webgl using three.js (can be seen here).
The thing is it looks a bit dull, and I want to add (as i hope i remember correctly from my computer graphics classes) ambient occlusion, to make the cloth nicely shaded on collision with ball. My knowledge about shaders is now on very low level, so I'd be very thankful for any resources on this topic helpful with three.js development (tutorials, book titles etc), because googles doesn't know anything about it.
So the shading is fixed thanks to WestLangley! Now back to the other questions: any helpful resources on shaders for threejs, or just hlsl in general?
Ambient occlusion is a scalar value recorded at every surface point indicating the average amount of self-occlusion occurring at the point on the surface. It measures the extent to which a location on the surface is obscured from surrounding light sources.
In most cases, ambient occlusion is calculated by constructing a hemisphere of rays emanating from a point on the surface in all directions and then checking them for the intersection with other objects.
July 2020) Screen space ambient occlusion (SSAO) is a computer graphics technique for efficiently approximating the ambient occlusion effect in real time. It was developed by Vladimir Kajalin while working at Crytek and was used for the first time in 2007 by the video game Crysis, also developed by Crytek.
There are several ways to produce ambient occlusion:
here are a few discussions on ambient occlusion in three.js:
most likely you would want to refer to this example from three.js to start you off:
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With