Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Margin Convention

Public visualization

Viewing a saved revision (read-only)

43d6ed5f5b684ef5a69fcf29388d1a7e

Margin Convention

0 stars1🌍 Public
JJohn Patrick Banas
Last edited Sep 10, 2021
Created on Sep 10, 2021

A bar chart displays the ten most populous countries using UN population data for 2019. The D3 v7 scales, `scaleBand` and `scaleLinear`, map country names and population values to SVG rectangles. React state manages the asynchronous loading of the CSV via D3's `csv` function. The chart applies the margin convention by translating a group element, reserving space for axes and labels within a 960 by 500 viewport.

AI-generated description

A program that loads in some data about CSS colors using D3 utilities, and uses React state to keep track of the data.