🌍 Public
Viewing a saved revision (read-only)
f178c66a954d4b2da4285dc0c26f12fd
The Margin Convention
This example displays a bar chart of the top ten countries by 2020 population, using a horizontal layout where each bar’s length is proportional to the population value. The visualization is built with React, using D3 utilities for data loading and scaling: `d3.csv` fetches the UN Population dataset, while `d3.scaleBand` and `d3.scaleLinear` map countries and populations to SVG rectangles. The SVG output is rendered inside a React component, with margins applied via a translation transform.
AI-generated descriptionA program that loads in some data about CSS named colors using D3 utilities, and uses React to render the data as a radial burst!