city-roads
Visualization of all roads within any city
A browser-based tool that renders every road in any city as a detailed visualization using OpenStreetMap data, with a pre-indexed cache of 3,000+ cities for fast loading and a scripting API for developers.
City-roads is a web-based tool that draws every road in any city as a single visualization. You type a city name into a search box, and the browser renders all the streets, highways, and roads within that area as a graphic. The output is both a functional map and, depending on the city, something that looks like a detailed piece of data art.
The road data comes from OpenStreetMap, a free and community-maintained global map. Fetching every road for a large city involves downloading a lot of information, so the project uses two strategies to keep things responsive. First, the author pre-indexed around 3,000 cities with populations over 100,000 and stored them in a compact binary format. For cities covered by this cache, the data loads quickly. For smaller towns or less common areas not in the cache, the tool queries the OpenStreetMap overpass API directly, which works but can be slower.
Location search is handled by a service called Nominatim, which translates the text you type into geographic area identifiers. The tool checks its pre-built city index first, then falls back to a live overpass query if no match is found.
Developers can go beyond just viewing a city. The project exposes a scripting interface that lets you write programs on top of the road data, automate what gets rendered, or build other tools around it. A companion repository called city-script provides examples, and the full API is documented in the main repository.
There are practical limits. A city like Seattle renders smoothly even on older hardware, but a megacity with over a million road segments can slow a phone significantly or crash the browser. Very large areas like a whole US state may also exceed what a browser can handle. Most cities work without issues. The source code is MIT-licensed.
Where it fits
- Type any city name and instantly see its entire road network rendered as a detailed graphic you can use as data art or a map reference.
- Use the scripting API to automate road rendering for multiple cities or build custom tools on top of the road data.
- Explore OpenStreetMap road data for smaller towns not in the pre-built index via the live overpass API fallback.