How I turned a bunch of Google MyMaps KML files into a single-page site (with help from Grok Build)

Or: 2,280 markers that I mostly didn’t collect, won’t visit all of, and still embedded into an HTML file.

It wasn’t exactly a secret, but I also wasn’t going around telling people: I’m planning a trip to Japan. What might deserve some context is that the mass cartographic madness didn’t start with me.

A friend who lived in Japan for a while, an otaku almost at my level, sent me the links to Google My Maps . She fed the maps with borderline manic zeal: temples, cafés, parks, and probably more categories that only make sense in her head. The maps came separated by region, plus one file just for TOKYO. Why is TOKYO separate? No idea, never asked, and life goes on.

The only list that’s mine in the package is the tokusatsu one: filming locations I gathered from the internet, because yes, I also need to know where Ultraman “stepped” in 1973.

I received everything like someone receiving a CIA dossier, except instead of state secrets it’s coordinates for a ramen place that apparently I needed to know about.

And yes: I know I won’t go to all of them. She knows. You know. The map knows. The 2,280 markers know. Universal consensus. The trip is real; the idea of completing 100% of the itinerary is protagonist-of-an-overly-optimistic-anime stuff.

Phase 1: Exporting the KML from Google My Maps

My Maps exports KML by region. The files come out with messy names, a mix of numbering, romaji, and kanji. Each one carries hundreds of points accumulated over time.

When you zoom out and look at everything together, the honesty is brutal: it looks like a regular map of Japan. It’s not “a travel itinerary”, it’s almost a representative sample of the entire archipelago in the form of a plague of markers. If Japan were a cake, this KML would be the slice where someone ran their finger through the icing and said “no, still not enough”.

Exporting is easy. The hard part is using it outside the Google ecosystem in a way that:

Doesn’t require opening My Maps (because the mobile app is… an experience);
Shows everything on a navigable map without the browser crying;
Allows filtering by region without losing your sanity;
Works when I want to check it, not when Google remembers the map exists.

In other words: I wanted a site. A simple site. Ridiculously simple. One page. One HTML file. The minimalist style of 1997, but with Leaflet and without the GeoCities aesthetic (my nostalgia has limits).

My contribution to the collection was modest (tokusatsu and shared guilt). My technical contribution started here.

Phase 2: Generating the site with Grok Build

The Grok Build (Grok’s CLI for development) generated a good part of the code. The model that did the heavy lifting was Composer 2.5.

The request was more or less: read some KMLs, throw the points on a map with Leaflet, allow filtering by region, and work by opening the HTML directly in the browser, no server.

What came out of it:

A KML/ folder with the exports (the source of truth, or well-intentioned obsession);
The Tokusatsu.md list, which is the part I chose and put together;
A Python script that reads the KMLs, normalizes names (yes, there’s romaji now, because 湯殿神社 deserves dignity);
A single index.html with all ~2,280 points embedded in the file.

Why embedded? Because when you open HTML directly from a folder (file://), the browser blocks loading other local files for security. The solution is to put everything inside the HTML and let jQuery and Leaflet load from the internet. Spoiler: they load.

Phase 3: The resulting site (and the bugs that came with it)

The final result lives at cobalto.dev/japantravelplan and does the basics very well:

OpenStreetMap map with all the markers (real cartography, not that monochromatic gray of “dark mode” that looks like a dungeon map);
Sidebar list by region, with search;
Checkboxes to show/hide sources on the map (“only TOKYO”, “only Tokusatsu”, “I regret and show everything”);
Light/dark theme only on the interface, because the map is already pretty as is, thanks.

There were iterations. There was a list bug that disappeared when the group was collapsed. There was real-time filtering on search that made the browser slow with 2,280 markers. There was me manually breaking the <title> and thinking the site had died. It works, meaning, sometimes after three commits.

What remained and what you can use

If you also received (or worse, created) a My Maps that ended up looking like a cartographic plague, the flow is simple:

Export KML from My Maps (one file per map/region, if you want organization);
Run the build (python3 app/build-places.py) when the list grows again;
Open index.html, just that file already works anywhere with internet, including if you copy it to your phone.

You don’t need the entire repository to see the map. Just the HTML. It’s almost magic, if you ignore the 270KB of inline JSON and the existence of pykakasi in the pipeline.

What I learned from this

I started wanting a better way to check the maps. I ended up with a mini-product: build script, Japanese name normalization, marker clustering, filters, dark theme on the sidebar.

Google My Maps is still where the original collection was born. The site is where I navigate without guilt, filtering by region, accepting that I’ll visit a statistically ridiculous fraction of the total. My 55 tokusatsu markers sit there in the corner, modest.

And yes, Composer 2.5 via Grok Build did almost everything. I just managed the prompt and fixed the nonsense it invented.

If this serves as inspiration for you: KML can be taken out, HTML just works, and a list of 2,000 places doesn’t need to die trapped in an app that you only open when you remember you paid for Google One , even when you know from the beginning that you won’t step foot in all of them.

Now if you’ll excuse me, I need to choose which of the 530 TOKYO points are realistically visitable. That’s it. I promise not to inflate the tokusatsu list. 🤥