Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

The Margin Convention

Public visualization

The Margin Convention

0 stars1🌍 Public
Tthomasjungcoe
Last edited Mar 12, 2021
Created on Mar 12, 2021

A horizontal bar chart displays the 2020 populations of nine countries, using the margin convention to position a bar plot inside a centered SVG group. React state manages the data loaded from a CSV of UN population figures, while D3 utilities (`csv`, `scaleBand`, `scaleLinear`, `max`) compute the scales and dimensions. The bars render as SVG rectangles, with the group translated by the specified margin values to align the chart within the 960×500 viewport.

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.

Comments

Sign in to join the discussion.

MIT Licensed