liveBook · Manning

Choropleth map

As explained in D3.js in Action, Third Edition

A choropleth map is a map that encodes data values by varying the color of defined geographic regions.

A choropleth map compares values across geographic regions by varying each region’s color. A sequential color scale maps a continuous statistic to a continuous range of colors. section 13.2.3

A practical D3 implementation combines:

  • A d3.scaleSequential scale using d3.interpolateYlGnBu, with a domain capped at 100 so smaller differences remain readable. section 13.2.3

Nobel laureates by country

Map each country’s number of Nobel laureates from yellow for low values through turquoise to dark blue for high values, while leaving countries with none nearly white.

How D3.js in Action, Third Edition covers it

How deep it goes
Explains scale selection, domain capping, data enrichment, conditional fills, and tooltips, but not geographic projection internals.
Examples
Uses countries’ Nobel-laureate counts, YlGnBu coloring, country paths, and exact-count tooltips.
What it assumes
Assumes geographic features, country properties, laureate records, and D3 selection and scale patterns.
What you can do after
Build it with D3 by enriching geographic features, applying a sequential scale, rendering paths, and adding tooltips.
How it connects
Connects geographic maps with sequential color scales, D3, data binding, and tooltips.

Also explained in

Compare how 2 books explain choropleth map →

Related concepts

This explainer was generated by Manning's knowledge graph from the text of D3.js in Action, Third Edition. The section links point to the parts of the book it draws on.