Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Rendering Data with React & D3 cont

Public visualization

Viewing a saved revision (read-only)

ec26f92725964fa9a35d5e27d323a059

Fork of Rendering Data with React & D3 cont

0 stars1🌍 Public
DDanny Stephens
Last edited Sep 5, 2021
Created on Sep 5, 2021

This example displays the complete set of CSS named colors as an SVG pie chart, with each slice filled using its corresponding RGB hex value from a CSV dataset loaded via `d3.csv`. The chart is rendered through React components using `useState` and `useEffect` hooks, which fetch the data asynchronously and manage the loading state. A `d3.pie` generator computes the angles for each color, while `d3.arc` creates the path shapes with an outer radius equal to the full chart width. The visualization maps each data row to a slice, demonstrating how React and D3 v5 integrate for data-driven rendering.

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.