Riccardo Bonfanti
Computer Graphics Assignments

CS 425 Computer Graphics · Assignment 4

Ray tracing

A JavaScript ray tracer that reads scenes from JSON and renders spheres and planes with Blinn-Phong illumination.

The renderer supports ambient, diffuse and specular lighting, shadows, and recursive reflections with a configurable maximum depth. The images below build the final result up one term at a time.

What I implemented

  • Ray–scene intersection for spheres and planes
  • An ambient shading baseline
  • Diffuse lighting with shadow rays
  • Specular highlights using halfway vectors
  • Recursive reflections with depth control

Results

Ray-traced spheres: ambient only.
Ambient only
Ray-traced spheres: diffuse and shadows.
Diffuse and shadows
Ray-traced spheres: specular highlights.
Specular highlights
Ray-traced spheres: reflections, depth 1.
Reflections, depth 1
Ray-traced spheres: reflections, depth 5.
Reflections, depth 5
Ray-traced spheres: the complete renderer.
The complete renderer

Live demo

Open in a new tab

Choose a scene from the dropdown inside the demo, adjust the settings, then press Render scene.