Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Unemployment Rate Heatmap

Public visualization

Viewing a saved revision (read-only)

3664988cf1124ef09d9449f72c747f3b

Unemployment Rate Heatmap

0 stars0🌍 Public
Oomniaabouhassan@gmail.com
Last edited Dec 4, 2024
Created on Oct 30, 2024

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.

AI-generated description

This project visualizes the monthly unemployment rates across different states using a heatmap.

Data Processing The data is processed to categorize monthly unemployment rates. The categorizeMonthlyUnemployment function transforms the raw data into a format suitable for the heatmap.

Scales xScale: Maps the months to the x-axis. yScale: Maps the states to the y-axis. colorScale: Maps the unemployment rates to a range of blue shades using d3.interpolateBlues. Axes X-axis: Displays the months. Y-axis: Displays the states.

Heatmap Rectangles Rectangles are drawn for each state and month combination, with the fill color representing the unemployment rate.

Tooltips Tooltips are added to display detailed information when hovering over each rectangle.

Legend A legend is included to indicate the color scale for the unemployment rates.