Globe → Map
The Earth unfurls. An orthographic sphere smoothly morphs into a flat equirectangular projection — and back. Every pixel follows real projection math, not tweening.
The trick
A custom hybrid projection that smoothly interpolates between geoOrthographic and geoEquirectangular— every pixel follows real projection math as the sphere literally deforms into a flat map. Manual coordinate projection with back-face culling eliminates d3's clip-boundary artifacts entirely.
Connection arcs
Great-circle paths between 6 cities with animated pulse particles that travel along each arc.
Drag momentum
Spin the globe and release — velocity decays naturally before auto-rotation resumes.
Projection math
City markers follow true geographic coordinates through the morph. No position tweening.
Atmospheric glow
Subtle radial gradient at the globe edge creates a sense of atmosphere and depth.
Theme reactive
Responds to the site's dark/light toggle instantly. Colors swap without unmounting canvas.
60fps canvas
requestAnimationFrame with DPR-aware rendering. No SVG, no DOM thrashing.