Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Rendering Data with React

Public visualization

Viewing a saved revision (read-only)

c63211d88c074e059031da0a991776d8

Rendering Data with React

0 stars1🌍 Public
JJasmine Ye Han
Last edited Jan 12, 2022
Created on Jan 12, 2022

This example visualizes CSS named colors as a horizontal stack of colored bars, with each bar representing a row from a CSV dataset loaded via D3’s `csv` utility. The React `useState` and `useEffect` hooks manage asynchronous data loading, initially displaying a “Loading…” message before rendering one colored `<div>` per color entry using inline styles. The app uses ReactDOM to mount the component, while the data source is fetched from a remote gist URL.

AI-generated description

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