The Hunt for Red Octangles is a 3D blimp-reconnaissance game using Three.js that turns real-world locations into 'Grid' type maps from the movie Tron. You can jump to almost any city in the world (Manhattan, Paris, London, or even your own neighborhood) and the game will procedurally generate the 3D buildings and road networks using the Overpass API.
The Tech Stack:
Three.js: For the 3D rendering and searchlight effects.
Overpass API (OSM): For fetching building footprints and road vectors.
Photon API (Komoot): For the geocoding/search functionality.
I did something similar a couple of years ago (map no longer live). I did use the badwords list to try and stop some profanity https://github.com/MauriceButler/badwords. However I was also surprised by how well people mostly behaved and was expecting a lot more vandalism - especially in disputed territories. I like the idea of allowing people to challenge names and voting to prevent abuse. Also - 'Hide NZ' :)
Yeah, same, I was surprised how well people behaved, most were more creative than toxic.
I checked that badwords list too, but it feels outdated and it’s not great for maps: it blocks words like "dick", and there are plenty of official place names and features that contain that substring and more others surprising examples.
These days it's easy to plug in AI-based profanity filter quickly. I'm also not too worried about people making "penis" jokes on the map, the dataset already has plenty of that stuff anyway, word-play is a base for geography naming.
I built GeoCards to make geographic discovery more fluid.
The Tech Stack:
MapLibre GL: For the vector map rendering.
OpenFreeMap: I’m using their 'Liberty' style for the tiles.
Wikipedia REST API: To pull the page summaries and thumbnails.
Photon (Komoot): For the geocoding/search functionality.
The Challenge: One of the trickier parts was ensuring that clicking a label actually registered the correct entity. I’ve implemented a fallback to a Wikipedia GeoSearch (radius-based) if the specific label name doesn’t have a direct "Summary" page match.
Bug report: only the very top of the bottom row of tiles fits on my screen, and I can’t scroll down to see what’s on them because it gets misinterpreted as dragging a tile. So that’s frustrating . iOS safari.
Thanks for the feedback. Using the full-screen option should reveal the bottom row. We will also work on adding a bottom margin - which should fix the problem when the full-screen option is not selected.
GeoTripper is an interactive game in which you must solve Traveling Salesman Problem (TSP) challenges in 12 different regions of the world. You earn points based on how close your devised path matches the optimal route.
The Tech Stack:
Three.js: For the 3D rendering and searchlight effects.
Overpass API (OSM): For fetching building footprints and road vectors.
Photon API (Komoot): For the geocoding/search functionality.
reply