Choropleth V5

100%

✓ Published0🌍 Public

Last edited Apr 6, 2018

Created on Apr 6, 2018

This choropleth map visualizes county-level unemployment rates across the United States. Using D3 v5 with SVG rendering, the example loads county and state boundary geometries from a TopoJSON file and joins them to unemployment rate data from a TSV file via Promises. A threshold color scale maps unemployment percentages (2–10+) to a blue sequential scheme, with a horizontal legend positioned at the top of the map. County polygons are filled according to their rate, with tooltips showing the exact percentage, while state boundaries are overlaid as white strokes. The map is paired with an axis showing the unemployment-rate scale.

AI-generated description

5.x implementation of a choropleth map, using Promises.

Forked from <a href='http://bl.ocks.org/mbostock/'>mbostock</a>'s block: <a href='http://bl.ocks.org/mbostock/4060606'>Choropleth</a>

gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

Multiple datasets in 5.x

A choropleth map of U.S. county unemployment rates, rendered in SVG with D3 v5. County data is loaded asynchronously from a TSV file alongside TopoJSON geometry using Promise.all, then joined and mapped to color. The map uses a threshold color scale with a blue scheme, and includes a legend with an axis showing the unemployment rate percentages. State boundaries are overlaid as white lines.

Aadamjanes

93% match

Loading thumbnail…

Choropleth

This choropleth maps U.S. county-level unemployment rates from 2008, encoding values with a d3.scaleQuantize that bins rates from 0 to 15% into nine color classes. Rendered with SVG, the map uses a white state boundary overlay to delineate county borders, while the quantized color scale (from light blue to dark navy) visually distinguishes unemployment ranges. The visualization is built with D3 v4 and TopoJSON, and it includes a resize handler to scale the map responsively.

EEvertLagerberg

91% match

Loading thumbnail…

D3 Choropleth Starter

A choropleth map of United States county unemployment rates, colored with a blue threshold scale. The map displays each county as a path, with hover tooltips showing the exact rate. The visualization loads county boundaries and unemployment data via Promises, then renders them using D3's `geoPath` and TopoJSON feature extraction. A legend with an axis shows the color scale, while state borders are drawn as a white mesh overlay.

AAlark Joshi

91% match

Loading thumbnail…

Choropleth map

This choropleth map displays U.S. county-level unemployment rates as of August 2016, using a threshold scale with a blue sequential color scheme. The map is rendered as SVG with `d3.geoPath` and TopoJSON data from the Census Bureau and the Bureau of Labor Statistics. A legend with a linear axis shows the percentage ranges, and hovering over a county reveals its exact rate via a tooltip. The code also demonstrates preprocessing the raw fixed-width text data into a TSV using command-line utilities like `dsv2dsv`.

EEleonore9

90% match

Loading thumbnail…

Choropleth

This choropleth maps unemployment rates across U.S. counties as of August 2016, using a threshold color scale to bin rates into discrete categories. County boundaries are rendered as SVG paths from TopoJSON, with color encoding based on the unemployment rate. The data is sourced from the Bureau of Labor Statistics, transformed from a fixed-width text file into CSV using command-line tools, and visualized with D3 v4.

Aalex-rind

90% match

Loading thumbnail…

Choropleth

A choropleth map of U.S. county unemployment rates for August 2016, drawn as SVG paths using `d3.geoPath`, colors each county with a `d3.scaleThreshold` and the `d3.schemeBlues` color scheme. A legend displays the color scale via a linear axis. The map uses TopoJSON from the U.S. Census Bureau and unemployment data from the Bureau of Labor Statistics, loaded with `d3.queue` and `d3.tsv`. State boundaries are overlaid as a white mesh using `topojson.mesh`.

Mmbostock

90% match

Loading thumbnail…

Choropleth w/ state highlighting

This choropleth displays U.S. county unemployment rates colored on a quantize scale from light to dark blue, overlaid with white state boundary lines. When hovering over a county, its outline turns red and all counties outside that county’s state fade to 50% opacity, using CSS classes generated from the state FIPS code to highlight the state containing the hovered county. The map uses an Albers USA projection and is built with D3 v3 and TopoJSON, with county fill colors mapped from unemployment data.

Aalexmacy

89% match

Loading thumbnail…

Chloropleth

This choropleth maps 2008 U.S. county unemployment rates, encoding each county’s rate with a color from a blue sequential palette. The data is loaded from an external TSV file and joined to county geometries from TopoJSON. A d3.scale.quantize maps the continuous unemployment domain (0 to 15%) to nine discrete CSS classes, q0-9 through q8-9, with darker blues representing higher rates. The map is rendered with SVG using an Albers USA projection, and state boundaries are drawn as white lines over the colored counties. This example is copied directly from Mike Bostock.

Aandyreagan

88% match