HAHS.
Back to Catalog

Choropleth Map

chart

Also known as: thematic map, shaded map, color-coded map

Show geographyCompareShow distribution GeographicNumericalCategorical Map

Description

A choropleth map uses color intensity or hue to encode a data variable across predefined geographic regions such as countries, states, counties, or census tracts. Each region is filled with a color drawn from a sequential, diverging, or categorical color scale, allowing readers to identify spatial patterns, clusters, and outliers at a glance. The geographic boundaries serve as the visual scaffold, and the color fill carries the quantitative or categorical information.

Choropleths are among the most widely recognized data visualizations because they leverage the reader’s existing geographic mental model. When someone sees a map of their country, they instantly orient themselves and can focus on the data story. This familiarity is a major strength, but it also introduces a well-known pitfall: larger regions dominate visual attention regardless of their data importance, which can mislead interpretation when population or density varies dramatically across regions.

The effectiveness of a choropleth depends heavily on the choice of color scale and classification method. Equal-interval, quantile, natural breaks (Jenks), and unclassed schemes each produce different visual impressions of the same data. Thoughtful selection of these parameters — along with a clear legend — is essential for honest and effective communication.

Choropleth — interactive example

When to Use

  • Showing how a variable (e.g., income, election results, infection rate) varies across geographic regions
  • Comparing rates or normalized values (per capita, percentages) across areas
  • Revealing regional clusters, gradients, or spatial autocorrelation in data
  • Providing geographic context that would be lost in a non-spatial chart

When NOT to Use

  • When displaying raw counts rather than rates — large regions will appear artificially important; normalize the data first or use a bubble chart on a map
  • When regions vary enormously in size (e.g., Russia vs. Luxembourg) — consider a cartogram or tile grid map instead
  • When precise value comparison is needed — color discrimination is imprecise; pair with a bar chart or tooltip
  • When the data has no meaningful geographic dimension — a heatmap or bar chart would be clearer
  • When you have point-level data rather than area aggregates — use a dot density map or scatterplot on map

Anatomy

  • Geographic boundaries: Polygons representing regions (countries, states, zip codes), typically sourced from GeoJSON or TopoJSON
  • Color fill: Each polygon is filled according to the data value using a color scale
  • Color scale / legend: A continuous gradient or discrete bins showing the mapping from value to color
  • Boundary strokes: Thin lines separating regions, kept subtle so they don’t compete with the fill color
  • Labels or tooltips: Region names and exact values, usually shown on hover

Variations

  • Classed choropleth: Data is binned into discrete classes (e.g., 5 color steps), simplifying interpretation but losing nuance
  • Unclassed choropleth: A continuous color gradient with no binning, preserving detail but making comparison harder
  • Bivariate choropleth: Two variables are encoded simultaneously using a 2D color matrix (e.g., income and education)
  • Cartogram hybrid: Region areas are distorted to represent a second variable (e.g., population), then filled with choropleth color

Code Reference

// Observable Plot choropleth with TopoJSON
import * as Plot from "@observablehq/plot";
import {feature} from "topojson-client";

const states = feature(us, us.objects.states);

Plot.plot({
  projection: "albers-usa",
  color: {scheme: "YlGnBu", legend: true, label: "Unemployment rate (%)"},
  marks: [
    Plot.geo(states, {
      fill: d => dataMap.get(d.id),
      stroke: "white",
      strokeWidth: 0.5,
      title: d => `${d.properties.name}: ${dataMap.get(d.id)}%`
    })
  ]
})