See the time anywhere on a live day-and-night map and find meeting times across cities.
World Clock is an interactive timezone, geographic visualization, and SEO-driven city directory application developed under Garage.ist using React 18, Vite, and D3.js. It pairs a D3 projection rendering engine with an SSG/Prerender pipeline, solar terminator calculations, and multi-city meeting planner tools. I co-led the first version; another developer at the startup has carried it on since.
Developed with React, D3.js, and Vite, World Clock utilizes a D3 projection rendering pipeline on HTML5 Canvas alongside an SSG/Prerender architecture for SEO optimization. The visualization morphs between an orthographic globe view and a flat map projection, supported by real-time solar position calculations, timezone offsets, DST rules, and prerendered static city directory pages.
Key Highlights
- D3.js projection morphing between an orthographic globe view and a flat map.
- SSG/Prerender static page compilation pipeline via Vite + React for SEO indexability.
- Solar terminator computing and rendering real-time day/night boundaries from subsolar coordinates.
- Cross-timezone working hour overlap and meeting planner tools.
- Multilingual city directory data integration supporting 5 languages (TR, EN, DE, FR, ES).
React 18 · D3.js · Vite · SSG / Prerender · TopoJSON