Skip to main content
SimilarExport ZIP
100%

A9 Choropleth

✓ Published2🌍 Public
NNoah C.
Last edited Apr 2, 2024
Created on Apr 1, 2024

This choropleth visualizes U.S. county-level poverty rates for 2021, with each county colored along a threshold scale of green shades; hovering reveals a tooltip with the county name and its exact percentage. The map is rendered as SVG using D3 v7’s `d3.geoPath` and TopoJSON `topojson.feature` to draw county boundaries, while a separate mesh path outlines counties lacking data. Poverty data is loaded from a CSV via `d3.csv`, and the color legend is generated with the d3-legend library. The visualization also includes a title and uses a linear scale to position the legend.

AI-generated description

Choropleth visualization of poverty rates by county made with D3. Reference: D3.js Choropleth Map Code Walkthrough

Hover over a county to see its name and poverty rate.

MIT Licensed

Similar vizzes

Loading thumbnail…

A9 Choropleth Map in D3

This choropleth map visualizes poverty rates across U.S. counties, using a blue sequential color scale to encode the percentage of residents in poverty for 2021. County boundaries are rendered as SVG paths via `d3.geoPath()` from TopoJSON data, while color values are mapped from a CSV dataset joined by FIPS codes. The map includes a hover tooltip via SVG `<title>` elements, and missing data appears gray. It uses D3 v7, TopoJSON, and d3-legend for potential legend support.

EEric Yao
95% match
Loading thumbnail…

A9 - Choropleth Map in D3

This choropleth map shows 2021 poverty rates by US county, using a red sequential color scale to encode percentages from 0 to over 40. The visualization renders US counties as SVG paths via `d3.geoPath` and `topojson`, with state boundaries overlaid. County data comes from a USDA CSV, joined by FIPS ID, while map topology uses the `us-10m.v1` TopoJSON file. A threshold-based legend with an axis label communicates the rate categories. County-level tooltips appear on hover, though the code also appends native SVG `<title>` elements for basic interactivity.

RRiya Mathur
94% match
Loading thumbnail…

A9- World Chloropleth

This choropleth visualizes poverty rates across U.S. counties using a threshold color scale with seven shades of red. It renders county boundaries as SVG paths via `d3.geoPath` and topojson, with each county filled according to its poverty value from a CSV dataset. Interactive tooltips display the county name and poverty figure on mouseover, powered by D3 event handlers. The visualization relies on d3.v6, topojson.v2, and d3-legend.

Jjrcuster@dons.usfca.edu
94% match
Loading thumbnail…

A9 - Choropleth map

This choropleth map visualizes poverty estimates across US counties in 2021, using a red sequential color scale to encode rates. The map renders county boundaries as SVG paths via `d3.geoPath` and TopoJSON, with white state borders overlaid for context. Hovering over a county triggers a CSS tooltip displaying the area name, state, and poverty value, while the county highlights in steel blue through a class toggle. A legend with an `axisBottom` scale maps thresholds from 0 to 50 percent, and data loads from an external CSV with `d3.csv`.

DDuc Pham
94% match
Loading thumbnail…

A9-Chloropleth

This choropleth maps poverty rates across U.S. counties using a red sequential color scale, with tooltips displaying the county name and exact poverty value on hover. The visualization employs d3.csv to load poverty data keyed by FIPS codes, d3.json to fetch TopoJSON boundaries, and d3.geoPath to render county shapes as SVG paths. A d3.scaleThreshold with seven bins assigns colors from d3.schemeReds, while mouse events drive a custom tooltip appended to the page. The code also uses d3-legend implicitly via script inclusion, though no legend is explicitly drawn.

Jjrcuster@dons.usfca.edu
94% match
Loading thumbnail…

A9 - Choropleth

This choropleth maps 2021 poverty rates by U.S. county, coloring each county on a blue sequential scale where rates are multiplied by five for stronger visual contrast. The visualization loads county and state geometries from the us-atlas TopoJSON file, then joins them with USDA Economic Research Service poverty estimates via FIPS codes. It renders using d3.geoPath inside an SVG, with state boundaries drawn as white meshes and county tooltips showing the county name, state, and exact poverty percentage. The code uses d3.json and d3.csv for data loading, along with d3.scaleSequential and d3.interpolateBlues for color encoding.

AAndrew Blakeslee Moore
93% match
Loading thumbnail…

Choropleth Map of County Data

This choropleth map visualizes county-level poverty rates across the United States. The map uses a green color scale, with darker shades indicating higher poverty percentages, and includes a legend with a color gradient. The visualization is rendered as an SVG and built with D3 v5, using `d3.geoPath` to draw county and state boundaries from a TopoJSON file. County data is loaded from a CSV and mapped to colors via `d3.scaleThreshold`, while tooltips display the exact poverty rate for each county.

JJacob Souch
93% match
Loading thumbnail…

A9: D3 Choropleth Map

This choropleth map visualizes county-level poverty population data for 2023 across the United States. It uses a quantile color scale with six classes from light pink to dark red to show the distribution of poverty counts. Built with D3.js and TopoJSON, the map renders county boundaries as SVG paths using `d3.geoPath`, and includes interactive tooltips that display county names and data values on hover. The data is loaded from a local CSV file and joined to geographic features by FIPS codes.

Rronnieferrufino4908@gmail.com
93% match