Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Margin Convention Bar Chart

Public visualization

Viewing a saved revision (read-only)

1905d7d614e6441d83bd79f0f6d8c4e7

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!