Redefining Web Maps
How to trick your Mapbox GL maps into non-mercator projections.

How to trick your Mapbox GL maps into non-mercator projections.
The Washington Post wanted to take advantage of Mapbox GL to create fast, responsive election maps for the 2016 election. They also needed to use the Albers US projection, which Mapbox GL doesn’t support out of the box. Dirty Reprojectors was born from this project and is now used to make more beautiful, meaningful maps all over the web.
“Working with the Washington Post we helped bring Web Mercator’s reign of terror to an end.”
See how we’ve used this project in our work
With the washington Post
The Washington Post 2018 election maps use Mapbox GL paired with an Albers USA projection.
View ProjectWe started with standard WGS 84 coordinate geojson files and projected those files into our desired projection. Next, we scaled the result to fit within the Web Mercator coordinate system.
We took the scaled files and reverse-projected them back into WGS 84, before converting them to mbtiles and uploading the whole thing to Mapbox Studio.
We used Mike Bostock’s d3-geo and d3-geo-projection libraries to do the heavy lifting on the rather tricky projection math.
To show some of the projections you can achieve with this method, we built the Dirty Reprojectors App. The site includes the long list of projections d3 comes bundled with, and will also accept and project your own geojson files.
For greater control over projection variables like parallels and center points, use the Dirty Reprojectors CLI instead. There you can tweak the projection code as needed.