Three.js Demos
Three.js Demos

Stereo Rig Sandbox (r183 roadmap)

Side-by-side stereoscopic camera rig playground with eye-separation and convergence controls for tuning parallax comfort and depth intensity.

Key topics: three.js stereo camera, eye separation, convergence, stereoscopic rendering, r183

What this code does

- StereoCamera Split View: renders `StereoCamera.cameraL` and `StereoCamera.cameraR` side-by-side in one canvas.
- Eye Separation Control: adjusts `stereo.eyeSep` to tune interocular distance and stereo depth strength.
- Convergence Control: maps camera focus distance to a visible convergence plane for parallax calibration.
- Depth-Rich Scene: layered ring geometry provides near/far references to evaluate stereo comfort quickly.
- Practical Use: useful for prototyping stereoscopic camera rigs before integrating anaglyph, VR, or custom display pipelines.

Related Demos

Continue Learning

Read the Three.js Documentation

JavaScript Implementation

ES6+ 
const stereo = new THREE.StereoCamera()
stereo.eyeSep = 0.08

camera.focus = 10
stereo.update(camera)

renderer.setViewport(0, 0, width / 2, height)
renderer.render(scene, stereo.cameraL)

renderer.setViewport(width / 2, 0, width / 2, height)
renderer.render(scene, stereo.cameraR)
← Back