Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

d3 heatmap

Public visualization

Viewing a saved revision (read-only)

05c01201084a4cabaee43e533d9f8de8

d3 heatmap

1 star0🌍 Public
AAndrew
Last edited Feb 21, 2024
Created on Feb 21, 2024
Forked from HTML Starter

This example visualizes yearly infection counts for US states from 1970 to 1980 using a heatmap. Cells are colored on a red scale, with darker shades representing higher infection numbers, and hover interactions reveal a tooltip with state, year, and exact count. The visualization uses d3.csv to load data, appends SVG text elements for labels and legend, and creates colored rect elements for each data point. The tooltip is positioned with event.pageX and event.pageY, while the legend is drawn manually with a loop generating gradient rectangles.

AI-generated description

A health heatmap in D3

BTW: The data was simplified to help with creating this visualization.

Link to original dataset: https://corgis-edu.github.io/corgis/csv/health/