I wanted to test out WebGL's capabilities for path tracing after viewing Evan Wallace's path tracer, but with more features and corrected realism/gamma.
Rays are fired from the camera out into the scene, bounce around according to physical models, and record when they hit a light source. Whenever anything changes, the scene has to be re-traced (it starts out noisy, but converges to the correct image).
Try out the demo!
![View of spheres of different materials, over a wooden floor](/img/tesserace-047-background-full.jpg)
It includes full fresnel simulation of dielectrics, depth of field tone mapping, and caustics, but not spectral or polarized light. Spectral is generally supported, but the environment maps don't have spectral data.
![Caustics and tone mapping](/img/tesserace-029-caustics-tone-mapping.jpg)
![Bump mapping and procedural BRDFs](/img/tesserace-019-bump-texture-mapping.jpg)
Projections
It is capable of different projections:
![Stereographic projection](/img/tesserace-006-stereographic.jpg)
![Orthographic projection](/img/tesserace-010-orthographic.jpg)
Signed Distance Fields (SDFs)
I also experimented with signed distance fields (SDFs) based on Inigo Quilez's work. It included modeling an IKEA Pokal glass as a single formula.
![Cross section view of the glass SDF](/img/tesserace-036-glass-sdf.jpg)
![Opaque black view of the glass](/img/tesserace-037-glass-black.jpg)
![Normal rendering of the glass](/img/tesserace-041-glass.jpg)
Procedural Texturing
I also experimented with using the projection of a dodecahedron to bump-map/texture a soccer ball.
![Dodecahedron-based procedural bump mapping and texturing of a sphere to look like a soccer ball](/img/tesserace-soccer-ball.jpg)