Hi all. I made a browser space flight where everything sits at its real distance: you leave Earth, pass the planets at their actual positions for today, fly between nearby stars and end up outside the Milky Way and at Andromeda.
I started it because I wanted to feel how far apart things really are. Textbook diagrams put the planets right next to each other and I never had a sense of the gaps.
It’s three.js r170 with Vite, no other rendering library. A few parts that took the most work:
Scale. The scene goes from about a metre to 2.5 million light-years. The renderer uses logarithmicDepthBuffer. True positions are kept in km as JS doubles, and every frame I subtract the camera position so the camera is always at the origin (floating origin). Anything farther than 2e10 km, which is outside Neptune’s orbit, gets pulled in to that distance and scaled down by the same factor, so it keeps the same angular size. Without that, polygons more than about 1e15 km from the camera break up because of GPU precision.
Stars. About 110k stars from the HYG catalogue, packed into a binary file at 20 bytes per star (xyz in parsecs, absolute magnitude, RGB). The vertex shader works out the apparent magnitude from the actual camera distance every frame and turns that into point size and alpha. So from Earth you get the normal night sky, and if you fly to Sirius the sky is drawn as it would look from there.
Ultraviolet sky. Press V to swap the whole sky to the new full-sky UV map by Brice Ménard (released with Anthropic, made with Claude Science). I convert the Mollweide image to equirectangular with a Python script, and the sky sphere samples it by direction through a J2000 galactic rotation.
The UV landmarks (Orion Nebula, Vela, Cygnus Loop and so on) are flat planes placed at their real distance. Each fragment samples the map along the direction from the Sun, so from near Earth the plane lines up exactly with the sky, and as you fly closer it fills the screen. The map has no depth information, so these are flat on purpose. About a third of the map (mostly the galactic plane) is predicted from other wavelengths, per the map’s author.
Movement. Flight speed is 0.9 times the distance to the nearest surface, per second, so the same keys move you km near a planet and light-years between stars. Autopilot interpolates the log of the distance to the target and takes between 2.2 and 9 seconds. Planet positions come from Astronomy Engine, and when you’re close to a planet the camera rides along with it, so speeding up time doesn’t leave you behind.
The Milky Way you see from outside is a model, not a photo. The site also has two small games (a planet-capture strategy game and an asteroid dodger) drawn on a 2D canvas over the same 3D scene.
Things I’d like feedback on:
- Right in front of a UV landmark the additive blending blows out to white and you lose the shape. I haven’t found a good fix yet
- Frame rate on your GPU, especially laptops and phones (phones get 4K textures instead of 8K)
- Anything that looks wrong at the scale transitions, like stars popping or depth fighting
Credits: UV map by Ménard (CC BY 4.0), planet textures from Solar System Scope (CC BY 4.0), HYG Database v3.5.1 (CC BY-SA 2.5), positions from Astronomy Engine (MIT).