Procedural Earth-like Planet Simulation

A high-quality 3D procedural planet simulation built with Three.js, featuring realistic terrain, atmosphere, ocean, and player controls.

Features

Planet

• Procedurally generated spherical terrain with vertex displacement
• Multiple biomes: beaches, grasslands, deserts, tropical rainforests, temperate forests, boreal forests, tundra
• Snow-capped mountains and polar ice caps
• Instanced vegetation (trees) for scale

Ocean

• Realistic animated waves using Gerstner wave simulation
• Fresnel-based reflections and transparency
• Sun specular highlights
• Subsurface scattering for translucent wave edges
• Foam at wave peaks
• Underwater caustics lighting effect

Atmosphere

• Rayleigh and Mie scattering simulation
• Day/night cycle with proper lighting transitions
• Sunset/sunrise color gradients
• Limb glow visible from orbit

Clouds

• Volumetric-looking cloud layer
• Animated movement
• Proper lighting with shadows and backscattering
• Sunset tinting
• Lightning flashes in storm clouds at night

Aurora Borealis

• Dynamic multi-layer aurora at polar regions
• Visible on night side only
• Flowing curtain effect with color variations

Celestial Objects

• Detailed starfield with 10,000+ stars and shooting meteors
• Milky Way band across the sky
• Nebula clouds in the background
• Procedural moon with craters and maria
• Distant planets with atmospheric glow (gas giant with rings, ice giant, rocky planet)
• Comet with glowing tail
• Sun disc with enhanced corona and lens flare effects
• Orbiting satellites around the planet
• Debris ring around the planet
• Planet rim glow effect

City Lights

• Procedural city lights visible on night side
• Concentrated in temperate zones
• Warm yellow/orange glow

Post-Processing Effects

• Dynamic lens glare when looking at sun
• God rays effect from sun
• Atmospheric fog for depth
• Space dust particles near camera
• Cinematic lens dust overlay
• Vignette for cinematic look

Controls

Orbit Mode (default)

• Drag: Rotate view around planet
• Scroll: Zoom in/out
• P: Toggle to Player mode
• 1-5: Camera presets (front, orbital, top, close, cinematic)

Player Mode

• W/A/S/D: Move on surface
• Mouse: Look around (first-person)
• Space: Jump
• Shift: Jetpack (lift upwards)
• Ctrl: Sprint (run faster)
• P: Toggle back to Orbit mode
• Click: Enable mouse capture for look controls

GUI Controls

• Time: Adjust day/night speed and time of day
• Render: Adjust exposure
• Visibility: Toggle individual elements (clouds, aurora, trees, etc.)

Running the Project

npm install
npm run dev

The dev server runs on port 5174 (or next available port).

Technical Details

• Built with Three.js
• Custom GLSL shaders for ocean, atmosphere, clouds, and aurora
• Instanced meshes for vegetation (performance optimization)
• Procedural noise using simplex-noise library
• Vite as dev server and bundler

Requirements

• Modern browser with WebGL 2 support
• Node.js for development