Metropolitan Unemployment

100%

Metropolitan Unemployment

✓ Published0🌍 Public

Last edited Feb 9, 2016

Created on Feb 8, 2013

This visualization shows the distribution of unemployment rates across 380 U.S. metropolitan areas from January 2000 to December 2012. Using a time-series heatmap, it displays monthly unemployment rate bins as colored rectangles, with darker purple indicating higher numbers of areas within a given rate range. The code uses D3 v3’s `d3.time.scale`, `d3.svg.axis`, and `d3.interpolateLab` for color interpolation. Data from the Bureau of Labor Statistics is loaded via `d3.json` and rendered as SVG rectangles.

AI-generated description

Source: Bureau of Labor Statistics

This visualization shows the distribution of unemployment for 380 U.S. metropolitan areas from January 2000 to December 2012. I’m currently weighting each area equally, but it would probably be better to weight areas by the size of the civilian labor force. Thanks to Kevin Quealy for suggesting this dataset, which was the basis for his earlier graphic!

gpl-3.0 Licensed

Similar vizzes

Loading thumbnail…

US Census D3 Map

This map visualizes the 2018 unemployment rates for U.S. metropolitan and micropolitan areas, using color intensity to represent different percentage categories. Built with D3 v5 and Vue, it renders SVG paths from TIGER/Line boundary data combined with ACS 5-year estimates. The interactive legend filters regions by unemployment category, and hovering reveals specific values via tooltips.

AA. Parker Oakes

79% match

Loading thumbnail…

Heatmap

This heatmap visualizes U.S. unemployment rates across states and years, using a color scale from light gray to red to indicate low to high rates. It renders an SVG via D3.js (v7), with scales and axes built using `d3.scaleBand` and `d3.axisBottom`/`d3.axisLeft`, and colors assigned through `d3.scaleLinear`. Data loads from a CSV file using `d3.csv`. It includes axis labels, a legend, and a title, but no tooltips or interactivity beyond static rendering.

Oomniaabouhassan@gmail.com

77% match

Loading thumbnail…

US Metro Map of Unemployment Rates

A choropleth map of the United States displays unemployment rates for combined statistical areas, with each region colored by its rate for September 2020 from BLS LAU data. React renders the SVG, while D3 v5’s geoAlbersUsa projection and geoPath draw state boundaries and metropolitan shapes from Census TIGER TopoJSON files. Hovering a metro area reveals a tooltip with its name, FIPS code, and unemployment percentage.

PParker

77% match

Loading thumbnail…

Unemployment Rate Heatmap

This interactive heatmap shows monthly unemployment rates for selected U.S. states, with darker blue cells indicating higher rates and a vertical legend mapping the discrete color thresholds. Hovering over any cell reveals a tooltip with the state, month, and exact unemployment percentage. The visualization is built using d3.scaleBand for the axes, d3.scaleThreshold for the color encoding, and SVG rectangles rendered with D3. Data comes from the "Unemployment in America Per US State" GitHub dataset, with states sorted by descending unemployment rate.

Oomniaabouhassan@gmail.com

77% match

Loading thumbnail…

Multi-Line Voronoi with colors

This multi-line chart visualizes monthly unemployment rates across multiple U.S. metropolitan areas over time, with each line colored using a categorical scale. The chart uses an invisible Voronoi tessellation to enable precise mouseover interactions—the closest point on any line to the cursor is highlighted, and a tooltip displays the city name and value. A checkbox toggles the Voronoi overlay, which draws red cell boundaries when enabled. The data is sourced from the Bureau of Labor Statistics.

663anp3ca

75% match

Loading thumbnail…

Processing Fixed-Width Data

A line chart displays seasonally-adjusted unemployment rates for 380 U.S. metropolitan areas from 2000 to 2013. The visualization renders each city as a thin gray path, using d3.svg.line and d3.time.scale to plot rates over time. The example focuses on preprocessing: a Node.js script with d3.nest reads fixed-width text from the Bureau of Labor Statistics, extracts and reshapes the data into a compact TSV file via d3.tsv.formatRows, reducing a 9.9 MB source to 258 KB. The final chart is drawn with SVG.

Mmbostock

75% match

Loading thumbnail…

Map of unemployment rate in the US

This visualization displays a map of the contiguous United States with red circles overlaid on each state, sized proportionally to a fake unemployment rate dataset. The map is rendered using D3’s `geoAlbersUsa` projection and `geoPath` to draw state boundaries from a TopoJSON file. Circle positions are computed with `geoCentroid` and scaled using `scaleSqrt`, with data loaded asynchronously from the us-10m atlas. The SVG output shows both the static gray state shapes and semi-transparent bubbles representing relative unemployment figures.

Oomniaabouhassan@gmail.com

75% match

Loading thumbnail…

Metis United States Unemployment Rate

This example visualizes the 2017 United States unemployment rate by state using a choropleth map. State boundaries are colored on a linear scale from light gray to purple based on the rate in the `us-unemployment.csv` dataset. The visualization includes a text summary of average unemployment by region, calculated using `d3.nest()` and `rollup`. It uses `d3.geoAlbersUsa` projection with `d3.geoPath` for rendering GeoJSON, and SVG elements with mouseover tooltips display the specific rate for each state.

EElaineYu

75% match