How I built a map of 400+ London sights with Astro, MapLibre and OpenStreetMap

I built it because I could never find a map app for planning a trip the way I see it. Most of them either look like they were built in 1990 or are littered with useless false positives.

So I made London Tourist Map — a free web app with no signup and nothing to install. It puts 400+ London places and 17 day trips on one interactive map, including 38 hand-picked hidden gems. This is how it works under the hood, in plain terms.

What it had to answer

When you're actually in London with half a day free, the useful questions are boring and practical:

• Is it open right now, and until when?
• How much is a ticket — or is it free?
• How long does a typical visit take?
• Which station is nearest, and how many minutes is the walk?

Every place card tries to answer those. You also get a photo gallery, a rating, category badges (Editor's pick / Top rated where they apply), insider tips, accessibility details (step-free entrance, hearing loop, seating, toilets, parking), a Directions link to Google Maps, the walking route drawn on the map, and a heart that saves places to My trip in your browser — no account.

Mood filters help when the weather or the company changes: Hidden gems, Editor's picks, Only in London, Nature escapes, Thrills, Quirky & bizarre, Romantic, With kids, Rainy day, plus categories and a Free toggle. You can sort by Top rated, Hidden gems first, Most popular, Quickest visit, or Nearest to the map centre.

The home page also has curated lists (Top 10, Hidden gems, Free things to do). Themed maps cover West End theatres, football stadiums, museums and galleries, landmarks, palaces and castles, parks and gardens, bridges, markets, and Harry Potter London filming locations. There is a Where to stay layer with live hotel prices, and a travel eSIM link. Some ticket, tour and hotel links are affiliate links — the footer says so — which is how the free map pays for itself.

The stack

The front end is JavaScript and HTML, built with Astro, with a MapLibre GL vector map. Base map data is from OpenStreetMap. Tiles come from Protomaps, self-hosted at tiles.londontouristmap.com. Place images live on media.londontouristmap.com.

Hosting is Cloudflare Pages, with Layer7 hosting as well. Cloudflare R2 stores the map data.

I wanted something that loads in any browser on a phone or a laptop, without forcing people through a signup wall. A static Astro site fits that. MapLibre keeps the map under our control instead of locking us to one commercial map SDK. OpenStreetMap is the geography underneath. R2 holds the map data we serve; Pages (and Layer7) put the site on the network.

Place records are HTML files that get rebuilt on the server. When the data changes, we rebuild and ship again — no separate CMS sitting between the editors and what you see on the map.

Deep links matter for sharing. A post can land on a specific place (?place=tower-of-london-2378) or a filter (?vibe=hidden_gems), or on a themed route like /harry-potter-london/ or /museums/.

Ranking and the messy middle: data

Public copy says 400+ places. In the app filters there are 413 places in London plus 17 day trips. Descriptions are written by us. Opening hours on the cards come from Google Maps data (records on the site show a check date of 2026-10-18). Ticket "from" prices on the live site are shown in EUR. Language is English.

How we rank places is published on the site. "Real interest" is built from Google search trends plus data from activity providers, and we refresh it every month. On top of that we use visitor ratings weighted by how many reviews a place has. "Top rated" means the best 10% by that combined score.

The hard part is not drawing the map. It is the data. The biggest headaches are:

1. Venues closing — a place that was fine last month is gone or shut for works.
2. Getting real, accurate data — hours, prices and access details drift constantly.
3. Categorizing properly — putting hundreds of places into moods and themes that still make sense when someone filters "Rainy day" or "Hidden gems" on a phone in the rain.

Hidden gems are hand-picked (38), not just whatever scored low on popularity. Examples on the site include Sir John Soane's Museum (free Holborn house, only about 90 visitors inside at a time), Crossness Pumping Station, and St Dunstan in the East Church Garden. On the Harry Potter map you get places like Platform 9¾ at King's Cross, Leadenhall Market, and House of MinaLima (free gallery of the films' graphic props), each with the same hours and walk-time treatment as everywhere else.

How it feels to use

On a computer you get the list and the map side by side. On a phone the map is full screen and details slide up in a bottom sheet. There is a locate-me control for browsing near where you are. My trip stays in the browser so you can save a shortlist without creating an account.

That "works in any browser, nothing to install" constraint is why this is a web app rather than a native app with a login API in front of the map.

What's next

Two things on the roadmap: more niche maps for London, and a trip planner module. The niche maps are a continuation of what already ships (theatres, stadiums, Harry Potter, markets, and so on). The trip planner is the piece that turns a saved list into something closer to a day you can actually walk.

If you know London well, I would love corrections — wrong hours, a hidden gem we missed, or a themed map that should exist. The map is free to use here: https://londontouristmap.com/.