Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Loading Data with React and D3

Public visualization

Viewing a saved revision (read-only)

85bedbf93d104cb79add86304dd4ec73

Loading Data with React and D3

0 stars1🌍 Public
JJoeleen Kado
Last edited Mar 3, 2021
Created on Mar 2, 2021
Forked from Mouse Follower Two

This example displays a text summary of a loaded dataset, showing the number of rows, columns, and file size in kilobytes. The program uses React's `useState` and `useEffect` hooks to manage data loading asynchronously, fetching a CSV of CSS named colors from a GitHub gist via D3's `d3.csv` utility. The resulting message is rendered inside a `<pre>` element, with the D3 `csvFormat` function calculating the byte size. While the page is styled globally, the core visualization is purely textual, contrasting with the commented-out SVG circle markup in the HTML.

AI-generated description

A program that loads in some data of CSS Named Colors

D3 utilities and uses React state to keep track of the data