GitHub - ObservedObserver/world-map-reality: True size of countries playground

GitHub

3 min read Original article ↗

Use case 1: counries on other planets

fix-moon.mp4

Use case 2: Mercator projection

An interactive map that you can compare true size of countries with drag and drop.

fixmap.mp4

Online playground

Use case 3: Sea level rise simulator

screenshot-20260226-010756 image image

WebGL + Mapbox GL based flood preview using Terrain RGB elevation decoding on top of a satellite basemap.

About

The Mercator projection is one of the most common map projections, but it has a significant flaw: it distorts the size of countries based on their latitude. Countries near the poles appear much larger than they actually are, while countries near the equator are shown more accurately.

This interactive playground lets you explore how Mercator distortion works by dragging countries to different latitudes on the map. As you move a country, you'll see it resize in real-time based on the Mercator scale factor, revealing how the same country would appear if it were located at that latitude.

Features

  • Drag and drop: Select countries from the sidebar and drag them anywhere on the map
  • Real-time scaling: Watch countries resize automatically as you move them to different latitudes
  • Visual comparison: Compare multiple countries side-by-side at different latitudes
  • Latitude indicators: See latitude lines and labels to understand where countries are positioned
  • Country details: View original latitude, current latitude, and Mercator scale factor for any selected country

How it works

The Mercator projection uses the formula 1 / cos(latitude) to determine scale. This means:

  • At the equator (0°), the scale is 1:1 (no distortion)
  • At higher latitudes, the scale increases dramatically
  • Greenland, for example, appears much larger than it actually is because it's near the North Pole

By dragging countries to different latitudes, you can see how their apparent size changes based on Mercator's mathematical distortion, helping you understand why some countries look misleadingly large or small on traditional world maps.

SSG

Build with static prerendered routes:

SEO metadata source of truth:

  • src/seo-meta.json

Default prerender routes:

  • /
  • /country-size-on-planets
  • /custom-mercator-projection
  • /sea-level-rise-simulator

The prerender script assumes subpath deployment under:

  • /tool/true-size-map/

Equal Earth projection tool

The independent /tool/true-size-map/equal-earth-projection page compares Equal Earth and Mercator at a shared unit-sphere area scale. It includes country and Africa comparisons, whole-polygon distortion ratios, a latitude experiment, map-center presets, and shareable query parameters. The existing custom Mercator projection guide links to it.

The tracked dataset in public/maps/ is world-atlas 2.0.2, derived from Natural Earth 4.1.0. Both projections and all numerical results use those same outlines. Results are approximate spherical outline areas, not official national totals. Mercator results are withheld for regions clipped by the ±85.0511° limit.

Run yarn test:equal-earth with Node 22.6+ for projection, area, antimeridian, polar clipping, and share-state tests. yarn build also checks each prerendered route's title and canonical identity.

Analytics

Vercel Web Analytics records page views through SiteAnalytics. Clicks from this tool to other runcell.dev pages are recorded as the custom event runcell_outbound_click with two properties:

  • destination: destination hostname and path
  • placement: tool_nav_brand, map_header_home, or tool_footer_credit

Links within /tool/true-size-map/* are excluded so navigation between this tool's pages is not counted as traffic sent to the main Runcell site.

Sea-level data source

The sea-level simulator now runs on maplibre-gl with public, token-free sources:

  • Satellite imagery: Esri World Imagery tiles
  • Elevation DEM: elevation-tiles-prod Terrarium tiles