Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Rendering data with React & D3

Public visualization

Rendering data with React & D3

0 stars0🌍 Public
PPedro Henrique Vanali
Last edited Jul 2, 2023
Created on Jun 20, 2023

A donut chart of CSS named colors rendered as SVG, with each color represented as a wedge of identical size. The visualization loads color data from a CSV file using `d3.csv`, then uses `d3.pie` to generate arc segments and `d3.arc` to compute their paths. React manages the data-fetching lifecycle through `useState` and `useEffect`, displaying a loading message until the dataset arrives and then mapping each color to an SVG `path` element with its hex value as the fill.

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.

Comments

Sign in to join the discussion.

MIT Licensed