3D Globe Tile Viewer
Explore Earth on a 3D globe with live XYZ tile streaming. Switch between tile sources, track performance stats, and adjust layer opacity in real time. Built with Three.js WebGPU.
Platform
afterrealism.com/project/natural-earth-globe
3D Globe
WebGPU Tile Viewer
Key Results
Rendering with WebGL fallback for broad browser support
Tile sources: OpenStreetMap, OpenFreeMap, and ESRI Satellite
Stats: FPS, visible tiles, cached tiles, camera position
Feature Deep Dive
A self-contained 3D globe with modern graphics APIs, live tile streaming, and real-time performance monitoring.
WebGPU + WebGL
Modern graphics API with seamless fallback for older browsers. Three.js WebGPU renderer is used when available, with automatic WebGL fallback ensuring broad compatibility.
Live Tile Streaming
XYZ tiles loaded on-demand with LRU caching of 400 tiles. Only visible tiles are fetched and rendered, with smooth transitions as you pan and zoom across the globe.
Multiple Tile Sources
Switch between OpenStreetMap, OpenFreeMap, and ESRI satellite with live opacity blending. Each source renders on the same globe with instant switching and no reload.
Performance Dashboard
Real-time FPS counter, tile counts, memory usage, and camera coordinates. Monitor rendering performance and tile loading state as you navigate the globe.
Explore Earth in 3D with live tile streaming
Orbit the globe, switch tile sources, and monitor rendering performance in real time. WebGPU with automatic WebGL fallback.
Try It