Choropleth Map — GDP per Capita
Figure 29.1 , GDP per Capita by Region
A choropleth map exploits colour saturation and lightness as an encoding channel for a continuous quantitative variable
A choropleth map exploits colour saturation and lightness as an encoding channel for a continuous quantitative variable across pre-defined geographic regions. The viewer's visual system performs an effortless pre-attentive scan , dark regions read as high, light regions as low , without requiring them to decode any axis or scale. This makes geographic concentration, clustering, and outliers immediately visible at a glance. The critical perceptual dependency: this only works when the colour ramp is perceptually uniform , equal data steps must produce equal apparent colour steps.
The data structure is a one-to-one mapping of a normalized continuous variable to geographic regions (countries). The me
The data structure is a one-to-one mapping of a normalized continuous variable to geographic regions (countries). The message is about geographic variation , where in the world is the value high, where is it low, and what spatial clusters emerge? That question is fundamentally spatial, so the encoding must be spatial. A bar chart of 150+ countries would require sorting to be readable and would destroy the geographic signal entirely. A logarithmic scale is applied by default because GDP per capita spans three orders of magnitude ($200, $130,000).
The next-best alternative for this message is a bubble map (proportional symbol map) — circles sized by value, centred o
The next-best alternative for this message is a bubble map (proportional symbol map) , circles sized by value, centred on each country. It would be more accurate for precise comparison (area encodes magnitude, which is more readable than hue), but it fails for small countries (circles overlap in Western Europe, the Caribbean, Southeast Asia) and it cannot show the continuous geographic gradient that makes a choropleth visually compelling. The choropleth wins here because the message is about pattern across space , not precise comparison of individual countries.
The colour ramp interpolates from #F5EBE0 (pale parchment) to #3B1A07 (deep espresso) — both pulled from the walnut end
The colour ramp interpolates from #F5EBE0 (pale parchment) to #3B1A07 (deep espresso) , both pulled from the walnut end of the hai palette. This is a single-hue sequential ramp, which is perceptually honest: there is one direction of change (low goes to high), so there should be one direction of colour change. Diverging ramps (two hues meeting at a midpoint) are reserved for data with a meaningful zero or threshold , not for a one-directional continuous variable like income.
Framework — FT Visual Vocabulary FT Visual Vocabulary category: Location — "Where things are, geographic patterns and di
Framework , FT Visual Vocabulary FT Visual Vocabulary category: Location , "Where things are, geographic patterns and distributions." Abela quadrant: Comparison (comparing a single metric across many geographic units). Tufte principle applied: the map is the data; no redundant ink outside the colour encoding and necessary reference labels.
Paste this into Claude Code to generate a working version of this chart, plus its data file. The result will not be a perfect replica , the goal is that the reader can run the prompt, get a chart of this type, and read its source. Generate a complete, self-contained choropleth in D3 v7. Two files:
The ideas in this chapter didn't appear from nowhere. Charles Dupin drew the first known choropleth map in 1826 , a shaded map of France encoding regional illiteracy by darkness. The technique became the standard way to display any rate or density across geographic regions. Charles Dupin, circa 1830. AI-generated portrait based on a public domain engraving (Wikimedia Commons).
Charles Dupin, circa 1830. AI-generated portrait based on a public domain engraving (Wikimedia Commons).
The ideas in this chapter didn't appear from nowhere. Charles Dupin drew the first known choropleth map in 1826 , a shaded map of France encoding regional illiteracy by darkness. The technique became the standard way to display any rate or density across geographic regions. Charles Dupin, circa 1830. AI-generated portrait based on a public domain engraving (Wikimedia Commons).
Brutalist D3 × Claude · Ch.29 · Choropleth
That is the framework. Brutalist D3 times Claude, chapter 29: Choropleth. The patterns are now in place. Apply them.