A real-time, FlightRadar-style radar map that shows aircraft flying across the sky right now — their position, altitude, speed, heading, type and country. Built as a single static web app with zero cost, no API keys, and no backend server.
Live demo: https://sumitjindal1100-ui.github.io/sumit-skytrace/ · One of seven projects in my portfolio: https://sumitjindal1100-ui.github.io/
Dark radar map • hundreds of live aircraft • colour-coded by altitude • click any plane for full details.
- 🛰 Live aircraft pulled every 8 seconds from open ADS-B data
- 🎯 Smooth motion — planes glide between updates using great-circle dead-reckoning (not teleporting)
- 🌈 Altitude colouring — warm = low, cool = high, with a legend
- 🧭 Heading-accurate rotating aircraft glyphs with optional flight trails
- 🔎 Click any plane for full details: callsign, registration, type, altitude, vertical rate, ground speed, heading, squawk, and country derived from the ICAO 24-bit address
- 🛫 Flight route & path — for scheduled flights: departure & arrival city + airport (IATA/ICAO), the airline, a great-circle path drawn on the map, progress, and a live ETA estimate
- 🌍 Full ICAO country table — aircraft nationality across ~190 worldwide allocations
- 📊 Live stats — count, airborne vs. on-ground, highest, fastest
- ⌨ Search by callsign / registration, and quick-jump to busy hubs worldwide
- 📍 My location button (uses browser geolocation)
- 🎛 Toggles for trails, callsign labels, and a minimum-altitude filter
| Piece | Choice | Why |
|---|---|---|
| Flight data | airplanes.live v2/point API |
Free, no key, and the only major feed that sends Access-Control-Allow-Origin: *, so the browser can call it directly — no proxy needed. |
| Routes | adsbdb.com v0/callsign API |
Free, no key, CORS-enabled. Maps a callsign → origin/destination airports + airline. |
| Map | Leaflet + CARTO dark basemap | Free tiles, no key. |
| Rendering | Custom <canvas> overlay |
Draws hundreds of rotating, glowing aircraft at ~30 fps. |
| Hosting | GitHub Pages | A pure static site needs no server, so free static hosting just works. |
Because everything runs in the browser, there is nothing to pay for and nothing to keep running.
No build step. Just serve the folder (a server is only needed so the browser allows fetch):
# Python 3
python -m http.server 8000
# then open http://localhost:8000Or with Node: npx serve — or simply open index.html in a browser.
git add -A
git commit -m "SkyTrace live flight tracker"
git push -u origin main
# In the repo: Settings → Pages → Build from branch → main / root- Aircraft data © airplanes.live — please respect their usage guidelines. SkyTrace makes one modest request per refresh.
- Map data © OpenStreetMap contributors, tiles © CARTO.
- Coverage is community/crowdsourced ADS-B: excellent over land, sparser over open ocean. Each query covers up to a 250 nm radius around the map centre. Data is not for navigation.
- Country is inferred from the ICAO 24-bit address block (full standard allocation table, ~190 entries); a few rare blocks may show as Unknown.
- Routes come from adsbdb's crowd-built database — most scheduled airline flights resolve; private/charter/GA flights often won't. The ETA is an estimate (distance-to-go ÷ current ground speed) — live, not an official schedule. Exact scheduled departure/arrival times and onward aircraft rotations require a paid flight-data API (e.g. FlightAware) and are intentionally omitted to stay zero-cost.