Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

P5 Heatmap

Public visualization

Viewing a saved revision (read-only)

7959f3f34214448bbc64339dbc610cf8

P5 Heatmap

0 stars1🌍 Public
Mmariahdiaz
Last edited Sep 20, 2022
Created on Sep 7, 2022
Forked from HTML Starter

This interactive visualization displays natural gas consumption across selected U.S. states from 2005 to 2011 using a heatmap grid. The color intensity of each rectangle reflects the consumption value, with blue indicating lower consumption and pink indicating higher consumption. The P5.js sketch loads data from a CSV file containing state, year, and consumption columns, then renders the grid on a 600x500 canvas. The code normalizes consumption values by dividing by 950,000 and maps them to the fill color's red channel. State labels appear along the left axis, with years displayed across the top.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.