Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

React * d3 radial burst!

Public visualization

React * d3 radial burst!

0 stars1🌍 Public
DDavid Kim
Last edited Apr 20, 2022
Created on Apr 20, 2022

This example shows all 148 CSS named colors arranged as a radial burst, with each color occupying an equal slice of a full circle. Built with React and D3 v7, the visualization loads color data from a CSV file using `d3.csv`, then uses `d3.pie` and `d3.arc` to compute and draw the SVG paths. Each slice is filled with its corresponding RGB hex value, and the chart is rendered inside a React component that manages the asynchronous data loading with hooks like `useState` and `useEffect`. The result is a vibrant, full-circle color wheel that highlights the full spectrum of named CSS colors.

AI-generated description

Use React to render data

A program that loads in some data about CSS named colors

Comments

Sign in to join the discussion.

MIT Licensed