Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Margin Convention Bar Chart

Public visualization

Viewing a saved revision (read-only)

46595fb6adf44e65b7b62ab33f08df66

Margin Convention Bar Chart

0 stars1🌍 Public
DDavid Beales
Last edited Mar 27, 2023
Created on Oct 25, 2022
Forked from BarCharts

A margin convention bar chart displays the top ten countries by 2020 population, with horizontal bars ordered by country name. The visualization uses React to manage state and render SVG elements, while D3 v5 utilities handle data loading and scales: `csv` fetches the UN population dataset, and `scaleBand` and `scaleLinear` map country names and population values to pixel positions. Axis ticks are generated via `xScale.ticks()`, with the chart area offset by explicit margins for the left-aligned labels.

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!