Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Loading Data with React & D3

Public visualization

Viewing a saved revision (read-only)

a92a9ec1328a41ffae00c0cace942947

Loading Data with React & D3

0 stars1🌍 Public
CChaz
Last edited Jan 18, 2022
Created on Jan 18, 2022
Forked from Follow Mouse

This example demonstrates how to load CSV data in a React app using D3’s `d3.csv` utility, storing the fetched dataset in React state via the `useState` and `useEffect` hooks. The app fetches a CSV of CSS named colors from a gist URL and displays a summary message computed with `d3.csvFormat` and `data.columns`, showing the file size in kilobytes, total row count, and column count. While the data is pending, the interface shows a loading message. The code uses React 16.9 and D3 v7, with all rendering handled through a simple `<pre>` element.

AI-generated description

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