Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Ep. 16 - Loading Data with React & D3

Public visualization

Viewing a saved revision (read-only)

b4efa7a6fd2e4d0b97f2ae2713c6c51b

Ep. 16 - Loading Data with React & D3

0 stars1🌍 Public
YYee Han
Last edited Dec 23, 2020
Created on Dec 22, 2020
Forked from Mouse Follower

This example demonstrates loading CSS named color data from a remote CSV file using D3’s `csv` utility, with React’s `useState` and `useEffect` hooks managing the asynchronous fetch and component state. The resulting view renders a plain-text summary of the dataset size—calculating kilobytes, row count, and column count using `d3.csvFormat`—inside a large `<pre>` element. While the data loads, the React component displays a "Loading..." message. The visualization uses React 16.9, D3 v6, and relies on a gist-hosted CSV as its sole data source.

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.