Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Rendering Data with React

Public visualization

Viewing a saved revision (read-only)

8ad591ea857e48c193f8d3a521aadafa

Rendering Data with React

0 stars1🌍 Public
AArookie-2020
Last edited Jul 18, 2021
Created on Jul 17, 2021

This example renders a pie chart of CSS named colors using React for the user interface and D3 for the data loading and geometry. The `d3.csv` function fetches color data from a remote gist, while React's `useState` and `useEffect` manage the asynchronous loading state. Each slice is drawn as an SVG path using `d3.arc` and `d3.pie`, with the fill color pulled directly from the dataset's hex values. The visualization displays the full spectrum of named colors as equal-sized wedges.

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.