Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Barchart step 1

Public visualization

Viewing a saved revision (read-only)

47558928e9a04daf84fc1fb784054803

Barchart step 1

0 stars1🌍 Public
Ccaineosborne
Last edited Jan 14, 2022
Created on Jan 14, 2022

This example displays a horizontal bar chart of the top 10 countries by population for 2020, using data loaded from a CSV file via `d3.csv`. React state manages the asynchronous data fetching, and once loaded, `d3.scaleBand` and `d3.scaleLinear` position the bars within an SVG. The bars are rendered as `<rect>` elements, with the chart lacking axes or labels at this initial step.

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.