Subhampreet.exe — setupv2.1
Installing portfolio…0%
est. remaining 00:02
back

case study · 1 min read

Google Maps — a realtime world map on Mapbox

Timeline
Side project
Role
Solo — engineering
Stack
JavaScript
Mapbox GL
HTML/CSS
Google Maps — a realtime world map on Mapbox screenshot

Some overview

Maps are just data with good manners

I wanted to understand what it takes to put a living map on a page: tiles, location and routing.

Getting to work

Where am I, and how do I get there?

  • The browser’s geolocation API centres the map on you
  • The Mapbox Directions plugin adds A → B routing with traffic, driving, walking and cycling modes
  • Standard zoom, rotate and pitch controls
Map with directions panel
Map on mobile

Pausing to reflect

What I learnt

Plain JavaScript and a good SDK go a long way — this one has no framework at all.