Two spheres wedged in a sliced cone prove the focus property, with no algebra.
A double cone is cut by a tilting plane, and two spheres sit inside the cone, each touching it along a circle and the plane at one point: the foci. Tangents from a point to a sphere are equal, so for any P on the cut, the string PF1 matches the stretch of cone from P to the first contact circle, and PF2 matches the stretch to the second. Their sum is the gap between the two circles, the same for every P: an ellipse. Tilt past the cone's slope and the second sphere jumps to the upper nappe (the difference is constant: a hyperbola); exactly at the slope it runs off to infinity and its focus becomes a directrix (a parabola). The glass is ray traced analytically per pixel (a quadric cone, a plane and two spheres, composited front to back) and the proof's lines are drawn as crisp vectors, each piece dimmed by the glass in front of it.
Try it. Drag to orbit. Drag the slider, or press up and down, to tilt the plane through circle, ellipse, parabola and hyperbola, or press 1 to 4 to jump. Drag P along the curve, and press Space to stop it. Left alone, it tours all four conics.
Paste this into Claude Code, Codex or any coding agent to get a simple version running, then take it wherever you like.
Build a 3D visualization of the Dandelin spheres proof with JavaScript and the HTML canvas element. Put everything in a single index.html file with no libraries or build step, so I can open it directly in a browser.
Start simple:
- Make a canvas that fills the window, stays sharp on high-DPI screens (scale by devicePixelRatio), and resizes with the window. Paint a dark blue gradient background.
- Write a tiny 3D camera: a point orbiting the z axis, a look-at basis, and a perspective project(x, y, z) function. Let the pointer drag the orbit.
- Draw a cone with its apex at the origin and a half-angle of about 22 degrees as a wireframe: a few generator lines and rings.
- Cut it with a plane whose normal is (sin b, 0, cos b) and which sits a distance h from the apex. Draw the plane as a grid, and draw the conic by solving for the point where each generator direction g meets the plane (t = -h / (n · g)).
- Add the two Dandelin spheres. A sphere centered at (0, 0, z) touches the cone when its radius is |z| sin(alpha), and the plane when that equals |n · center + h|, which gives z = -h / (cos b ± sin alpha). The focus is the foot of each center on the plane. Draw the spheres as shaded circles.
- Move a point P around the conic, draw lines to both foci and print PF1 + PF2, which should never change.
Once that works, make it beautiful:
- Ray trace the surfaces per pixel into a small offscreen canvas: solve the cone's quadratic and the sphere and plane intersections, sort the hits, and blend them front to back as tinted glass, brighter at grazing angles.
- Draw the strings and the contact circles as crisp lines on top, and add a slider that tilts the plane through ellipse, parabola and hyperbola.
Explain the key ideas in short code comments. When you're done, tell me how to open it and suggest three directions I could take it next, such as showing the directrix for the parabola, a face-on inset of the cutting plane, or animating the plane so the spheres visibly swell and shrink.
