Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Visualizing data with D3 and React

Public visualization

Viewing a saved revision (read-only)

49d2ef1bf0204203bb8ec6c00aff6d0c

Visualizing data with D3 and React

0 stars0🌍 Public
JJames Yu
Last edited Oct 27, 2020
Created on Oct 27, 2020

This example shows a full-screen radial burst of colored arcs, one for each named CSS color, rendered as SVG paths. It loads a CSV of CSS color names and RGB hex values using `d3.csv`, then uses React hooks (`useState`, `useEffect`) to fetch and store the data. D3’s `pie` and `arc` generators compute the angular segments, each filled with its corresponding hex color, while React maps the data to `<path>` elements inside a centered `<g>` transform.

AI-generated description

A program that loads in data using D3 utilities, and uses React to render data as a radial burst.