Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Loading Data with React

Public visualization

Loading Data with React

0 stars1🌍 Public
SSofffos
Last edited Feb 27, 2021
Created on Feb 27, 2021
Forked from Load data use D3

This example demonstrates loading a remote CSV file and rendering its contents as a vertical strip of colored bars, one row per line, using React components. The visualization transitions from a loading message to the final layout once the asynchronous `d3.csv` request completes, with the data stored in React state. Each row’s `RGB hex value` is applied as a `backgroundColor` style on a fixed-width `<div>`. The code uses React’s `useState` and `useEffect` hooks alongside D3’s `csv` and formatting utilities, with the browser rendering the result as SVG-compatible HTML elements. The CSV source is a GitHub gist of CSS named colors.

AI-generated description

Smiley face implementation with React.

Comments

Sign in to join the discussion.

MIT Licensed