Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Axes with React & D3

Public visualization

Viewing a saved revision (read-only)

b02ca5d33a9e43fbba4e7a548ef3e3c5

Axes with React & D3

0 stars0🌍 Public
Ee-ines
Last edited Apr 7, 2021
Created on Apr 7, 2021

This example displays the ten most populous countries for 2020 as a horizontal bar chart, using United Nations population data fetched as CSV. The visualization is built by combining React for declarative SVG rendering with D3 utilities for data processing and layout. The code uses `d3.csv` to load and parse the data, `d3.scaleBand` to position each country along the y-axis, and `d3.scaleLinear` with `d3.max` to map population values to bar widths. The chart renders inside a React component that manages the loading state and constructs the SVG output.

AI-generated description

A program that loads in some data about CSS named colors using D3 utilities and uses React to render the data as a radial burst!