Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Fork of Loading Data with React & D3

Public visualization

Viewing a saved revision (read-only)

aca39d6743084756ba4b692980bc4457

Fork of Fork of Loading Data with React & D3

0 stars0🌍 Public
AAlish Shrestha
Last edited Nov 25, 2023
Created on Nov 25, 2023

This example visualizes a dataset of CSS named colors as a pie chart, with each slice filled using its corresponding hexadecimal color value. It loads the data from a remote CSV file using D3’s `csv` function, then manages the async data loading with React hooks (`useState` and `useEffect`). The chart is rendered as SVG paths computed by D3’s `pie` and `arc` generators, with the arc’s outer radius set to the full viewport width, creating a large, color-coded circular layout. React’s `useCallback` is also imported, though not used, and the data is fetched only once on mount.

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.