Fresnel's Canvas

What it does

This project models reflection and refraction, the two main ways rays of light change direction, as described by the field of geometric optics.

How we built it

This project is relatively simple, and can be boiled down to two classes: refractors, and rays. Refractors are described using mouse input, and then drawn using HTML Canvas. Rays are straight segments, forming a linked list that represents the path of a beam of light through the refractors.

Challenges I ran into

Detecting the intersection points between rays and refractors properly was difficult after the beam had already bent once. Also, handling the math involved was frustrating, since my derivations on paper never seemed to quite match up with what I was seeing on the screen.

What's next for Fresnel's Canvas

I will probably work on making the simulation more mathematically accurate, and also on ironing out the bugs with collision detection.

Built With

• html5
• javascript
• repl.it