How does the 2D version relate to the 3D Deep Space scene?

It reuses the same six planets, the same orbit radii and orbital speeds, and the same frame-rate-independent angle integration (angle += dt * speed), just rendered top-down on a flat canvas instead of a WebGL scene.

What do the controls do?

Time scale speeds up or slows down the simulated years per second, zoom changes how much of the system is visible, orbit trails draw each planet's recent path, and the asteroid belt toggle shows or hides the 340-object belt between Cindral and Torvex.

Why click on a planet?

Selecting a planet opens a side panel with its orbit radius, orbital period in simulated years, and moon count, read directly from the same configuration values driving the animation.

Home▸Space & Astronomy▸Solar System Orbital Mechanics (2D)

Solar System Orbital Mechanics (2D)

Top-down orrery view of the same six-planet system as the 3D Deep Space scene, driven by the same delta-time angle integration and rendered on a plain canvas.

Space & Astronomy2DEasy60 FPS📱 Mobile-adapted⇄ 3D version

This 2D companion reuses the exact orbit radii, orbital speeds and moon counts from the 3D "Deep Space — WebGL" scene's planet configuration, advancing every angle with the same angle += dt * speed integration so the two views stay physically in sync while looking completely different: one a WebGL scene you fly or orbit around, the other a flat canvas orrery you can pause, speed up, zoom and click through.

⚙ Under the hood

Top-down Canvas 2D orrery: six planets orbit a central sun on frame-rate-independent angle accumulators, with an optional 340-object asteroid belt, per-planet orbit trails, adjustable time scale and zoom, and a click-to-inspect panel showing each planet's orbit radius, period and moon count.

solar systemorbital mechanicsplanetsasteroid beltorrery

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install