Visualizing the Distortion of WebMercator Maps with an Orange Peel
Actually, it’s a clementine peel, but any peel-able spheroid will do for this sort of thing.
Most modern web maps use a projected coordinate system known as “Web Mercator”, aka EPSG 3857, which represents the surface of the earth as flat square, divided into several smaller squares depending on the zoom level. (I won’t get into the details of WebMercator and map tiles here, there are plenty of great resources explaining the concept, including this one by openstreetmap).
Like all map projections, WebMercator distorts the represented features on the earth’s surface. The distortion is minimal near the equator, and gets more extreme as you move towards the poles. Here’s a popular visual of WebMercator’s distortion (including the classic misrepresentation that Greenland is the same size as the continent of South America)
I found myself eating a clementine this morning, and thought it would be interesting to slice up the orange peel on an 8x8 grid to visualize how much of the earth’s surface is represented in WebMercator tiles at zoom level 3. This is kind of an inverse of the Tissot’s Indicatrix above, showing chunks of the spheroid’s surface over the projected tiles that represent them in web maps.
At this zoom level, the tiles adjacent to the equator represent 40.1 degrees of latitude, so almost half of each hemisphere’s is represented in these tiles! (I mean almost half latitudinally, as in 40.1/90, someone better at math than me can figure out what surface area is represented by these tiles)
Here’s breakdown of the latitudes before I laid everything out on the grid:
I hope this is helpful to anyone teaching GIS and web mapping! Give me a yell on twitter @chris_whong if you have comments or feedback. Happy mapping!
