Untitled

100%

✓ Published0🌍 Public

Last edited Apr 13, 2022

Created on Apr 13, 2022

This choropleth map shows the population distribution across U.S. counties, with a color scale from light blue to red indicating population magnitude. The visualization is rendered as SVG using D3 v7, employing `d3.geoAlbersUsa` for projection and `d3.geoPath` to draw county boundaries from `counties.json`. Population data is loaded from `PopulationEstimates.csv` and matched to counties by name, with a tooltip showing county name and population on mouseover. The code uses a sequential color scale with an RGB interpolator.

AI-generated description

Reference : https://d3-geomap.github.io/map/choropleth/us-states/

MIT Licensed

Similar vizzes

Loading thumbnail…

Untitled

A choropleth map of population density per square mile colors U.S. census block groups using a threshold scale and the sequential color scheme `d3.schemeOrRd[9]`. The visualization includes a square-root-scaled legend with an axis, and overlays county boundaries as black strokes at 30% opacity. The code loads TopoJSON data via `d3.json`, converts it with `topojson.feature`, and renders it with `d3.geoPath`. The legend uses `d3.scaleThreshold` and `d3.axisBottom`. The map is built with D3 v4 and React in the supporting files.

AAlice Hua

85% match

Loading thumbnail…

Untitled

This choropleth map shows population density per square mile across California counties, using a sequential orange-red color scale with a threshold legend. The visualization loads GeoJSON topology data and renders county boundaries as SVG paths via `d3.geoPath`. Colors are assigned by county ID using `d3.schemeOrRd[9]`, while the legend uses `d3.scaleThreshold` and `d3.axisBottom` to display the value ranges. County outlines are drawn from a separate topology object with a semi-transparent black stroke.

AAlice Hua

85% match

Loading thumbnail…

Untitled

A choropleth map of the United States visualizes state-level data from a CSV file, with each state filled according to a linear color scale (yellow to red) based on the `prem_an` attribute. The map also plots doughnut markers at state centroids, showing state abbreviations, and includes a partially commented-out section for city locations with circle sizes proportional to years lived. Built with D3 v3, the code uses `d3.geo.albersUsa()`, `d3.geo.path()`, and SVG paths rendered from GeoJSON, merging CSV attributes into the map's feature properties before binding data to the paths.

Iillus0r

84% match

Loading thumbnail…

Untitled

This example presents a choropleth map of global population by country, rendered as an SVG using D3.js v4. It employs a Mercator projection via `d3.geoMercator` and draws country boundaries with `d3.geoPath`. The fill color for each nation is determined by a threshold color scale that bins population values into a blue scheme from `d3.schemeBlues`. Data is loaded asynchronously with `d3.json` for the world GeoJSON topology and `d3.csv` for population figures.

AAaronBhasker

84% match

Loading thumbnail…

Untitled

An interactive choropleth map of the United States visualizes county-level population data, sourced from a local `data/us.json` file. Users can click counties to trigger a zoom animation, which reveals their unique identifier via an alert. The map is rendered using D3's geo projection and path APIs, with selections and transitions handled through D3's selection, transition, and animation methods.

AAshishKumar3301

84% match

Loading thumbnail…

Untitled

This visualization displays population density per square mile across U.S. census block groups using a choropleth map. A threshold color scale with d3.schemeOrRd maps density values to sequential red tones, while a legend with a sqrt scale and axis shows the breakpoints. The code loads TopoJSON data via d3.json, renders block group polygons with d3.geoPath, and overlays county boundaries as black outlines. An interactive legend is constructed with rect elements and d3.axisBottom.

CCurran Kelleher

83% match

Loading thumbnail…

Untitled

A choropleth map of population density by census block group uses a sequential color scale from the d3-scale-chromatic library to shade geographic regions. The visualization renders as SVG via d3.geoPath, with a threshold scale mapping density values to the OrRd color scheme and a legend using d3.axisBottom. It loads TopoJSON data containing block group polygons, fills each path according to its population per square mile, and outlines counties with a subtle stroke. The code applies d3.scaleThreshold and d3.scaleSqrt to encode the data range.

JJohan van Beusekom

83% match

Loading thumbnail…

Population Choropleth

A population choropleth of U.S. counties uses a logarithmic color scale to show population density, ranging from pale yellow to dark blue. The map projects counties with d3.geo.albersUsa() and renders them as SVG paths via d3.geo.path. Density is calculated by dividing each county’s population (from the 2010 Census shapefile, converted to TopoJSON) by its projected area, with the color domain set between the 1st and 99th percentiles. The topojson.feature API extracts county geometries for display.

Mmbostock

82% match