DEV Community

Andrew Sepic for Mapbox

Posted on • Edited on

Rebuilding geojson.io: A Look at the 2026 Overhaul

If you've worked with spatial data on the web, you've probably used geojson.io. Since Tom MacWright first built it in 2013, it's become one of those quietly indispensable tools in the mapping community — drop in a GeoJSON file, sketch a polygon, grab a quick bounding box, copy the coordinates back out. No GIS software, no setup, just a browser tab.

 geojson.io screenshot from October 2, 2015 - courtesy of Wayback Machine

This year we shipped the biggest change in the app's 13 year history: a full overhaul of the editor, cut over to production on June 1, 2026. Below is how we approached this, what changed, why, and what's shipped since.

Why overhaul it

geojson.io's core had aged in place for a while. Under the hood, it had already been through one generation of map tech — originally built on Leaflet-based Mapbox.js library, then refactored to Mapbox GL JS and Mapbox GL Draw in 2022 — but the application itself never changed alongside it. The UI was built entirely with D3, using its selection and data-join API as a general application-construction tool rather than for what it's best known for: data visualization. D3 has no built-in component model or state management, so anything beyond simple DOM bindings meant hand-rolling patterns a modern framework gives you for free.

Rather than start from the ground up, we forked Placemark Play — an open-source geojson editor, also built by Tom MacWright, with an editing model designed from the start around multiselect and structured data editing — and adapted it into geojson.io's new foundation.

How we approached it

Rewriting a decade-old tool creates an obvious risk: breaking workflows people depend on in the name of modernization. So one guiding principle shaped the whole project — treat every piece of legacy functionality as a question, not a given. Is this still useful? If so, does it need to look the same, or can it be replicated in a different pattern that fits better with the new architecture? Some features carried over largely unchanged; others got rebuilt around Placemark's multiselect-first editing model because the old pattern didn't make sense once "selection" could mean more than one feature at a time. That same audit ran in both directions — Placemark Play came with plenty of its own functionality that didn't serve geojson.io's specific mission, so a fair amount of the fork was just as much about stripping code out as building on top of it.

We also didn't cut over all at once. The update launched quietly at a parallel /next path back in January 2026, running alongside the legacy app so real usage and feedback could shape it before it became the default. That turned into a long stretch of triaging GitHub issues and user reports — and a lot of it wasn't about missing features so much as discovering how people were actually using geojson.io, often in ways we hadn't designed for or could have imagined. Users had built workflows around edge cases and quirks of the old app, well outside anything we'd call the "intended" use case. Each one became a judgment call: is this worth supporting, or would chasing it add complexity and noise the core tool doesn't need? We're still working through some of those today.

It's ended up being as much a product exercise as an engineering one — shaped by feedback from Mapbox teams using it internally, and by the broader open-source GIS/mapping community, who've been generous (and opinionated, in the best way) about what they need from a tool like this.

What Placemark gave us

Forking Placemark Play didn't just hand us a newer codebase — it came with capabilities legacy geojson.io never had, the kind of thing that would've been its own multi-month project to build from scratch. Multiselect and bulk editing meant selecting many features at once and updating their properties together, instead of one at a time. Real editing history — undo/redo, copy, duplicate — plus spatial and geometry operations. Improved data management, with a list view and table view alongside the map, name previews for features, and a feature editor that treats properties as structured data instead of a JSON blob you hand-edit. And a codebase built for the present — modern React patterns and TypeScript that are both easier for us to maintain and a lower bar for outside contributors.

The new stack

The overhaul moved the app to React 18, Vite, and TypeScript. A few of the more interesting pieces under the hood:

  • A More Capable Editing Toolkit All drawing and editing logic is custom, built around a PMap class that wraps Mapbox GL JS (v3.24.0) directly and layers a Deck.gl MapboxOverlay ( (@deck.gl/core, @deck.gl/mapbox, v9) on top for vertex rendering, selection highlighting, and snapping— This keeps a clean separation of concerns: Mapbox GL JS is responsible for rendering the app's GeoJSON data, while Deck.gl owns the editing UI — vertex handles, selection highlighting, and snapping.
  • State lives in Jotai atoms, with atomWithStorage things like camera position and UI preferences go straight to localStorage/sessionStorage, no separate persistence layer needed.
  • Heavy lifting happens off the main thread. Format conversion and reprojection — parsing a Shapefile, converting a big XLSX, reprojecting coordinates — runs in a Web Worker, built natively by Vite's worker support, so importing a large file doesn't freeze the map or the UI.
  • TypeScript earns its keep on the data model. GeoJSON Features, Geometries, and FeatureCollections aren't just untyped JSON — they're well-defined union types, and typing them properly catches a real class of bugs (wrong geometry type, malformed coordinate arrays) at the boundary, before they ever hit the map.

What we built on top

Placemark's foundation covered the editing and data model — what it didn't cover was the specific functionality legacy geojson.io users had come to expect: globe projection, custom raster layers, sharing, and a long tail of smaller behaviors. Closing those gaps, alongside genuinely new capability, has been most of the work since launch:

  • The geojson text editing panel (using CodeMirror), was a core part of the legacy geojson.io and ensures that your geojson text is still front and center next to your map. This helps beginners understand the geojson specification and formatting and also allows for direct editing and syncing to app state.
  • Moving the Feature Editor into it's own flexible dynamic pop up, giving full control over a wide array of data on the selected feature.
  • Simple Style Spec support for Markers & Polygons — render and edit simple style spec marker-color, marker-symbol, fill-color and more.
  • Custom raster layers, including WMS support and TMS tilesets with inverted Y coordinates, so you can bring your own basemap imagery.
  • Globe projection and 3D, with a toggle between globe and mercator, plus pitch/rotation for tilted views — integrating globe projection with Deck.gl's still-experimental support was one of the trickier parity problems.
  • Vertex snapping while dragging, so edited or drawn geometries snap cleanly to nearby features and vertices.
  • Shareable URLs — features are zipped and base64-encoded into a link, so you can hand someone a working map of your data without a backend.
  • A steady stream of smaller fixes: streamlined file import for unambiguous formats (GeoJSON, KML, GPX, Shapefile skip the dialog entirely now), mobile panel resizing and two-finger pan while drawing, and persisted camera state that survives a page reload.

It's a lot of surface area for a tool that's supposed to stay simple, and keeping it feeling simple — while adding real capability underneath — has been the actual design challenge of this overhaul.


The new geojson.io

Still open source

geojson.io remains open source, and the overhaul hasn't changed that. If you hit a bug or have a feature request, open an issue on
GitHub
— and if you want to see where it's headed, the full changelog is public too.

Thanks to Tom MacWright for building geojson.io in the first place, and for Placemark Play, which gave this project most of its DNA.

Top comments (0)