Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Rendering Data React & D3

Public visualization

Rendering Data React & D3

0 stars1🌍 Public
RRedSorrel
Last edited Sep 16, 2021
Created on Sep 15, 2021

This example displays CSS named colors as horizontal stacked bars, with each row rendered as a div whose background color corresponds to the RGB hex value from the dataset. It uses React hooks (useState, useEffect) to fetch and store data loaded via d3.csv from a gist, and conditionally renders a loading message until the data arrives. The visualization maps each color record to a fixed-width, 4-pixel-high row, producing a dense, rainbow-like strip.

AI-generated description

A program that loads in some data about CSS named colors using D3 utilities, and uses React state to keep track of the data.

Comments

Sign in to join the discussion.

MIT Licensed