All projects · UI Components & Interactions
EarthTwin — Digital Twin Platform
An interactive 3D WebGL globe that renders a textured, cloud-wrapped Earth with an atmospheric glow shader and procedural starfield.
An interactive 3D WebGL globe that renders a textured, cloud-wrapped Earth with an atmospheric glow shader and procedural starfield. Users orbit, zoom, and auto-rotate the planet, then click glowing city markers to trigger a smooth camera fly-to and a detail panel with coordinates, population, and description.
- Custom rim-lit atmosphere shader plus a 2,500-point procedural starfield with zero extra requests
- Multi-CDN texture fallback so a single CDN outage doesn't black out the globe
- Click-to-fly camera tween with drag-detection so orbiting never triggers a marker jump
- Six real cities with lat/lon-to-vector placement, pulsing halos, and a live camera lat/lon HUD readout
Built with: Three.js 0.160 (ES module via importmap), OrbitControls, WebGL, Custom GLSL atmosphere shader, Raycasting for marker picking, CDN-hosted NASA Blue Marble textures (unpkg/jsdelivr)