Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Ep. 22 | The Margin Convention

Public visualization

Viewing a saved revision (read-only)

dc97c04b02784065a4923354e4ee571d

Ep. 22 | The Margin Convention

0 stars1🌍 Public
YYee Han
Last edited Dec 24, 2020
Created on Dec 23, 2020

This example demonstrates a bar chart ranking the ten most populous countries in 2020, using data from the United Nations World Population Prospects 2019. The visualization renders as SVG rectangles, where each bar’s length encodes population via `d3.scaleLinear` and its vertical position uses `d3.scaleBand`. React manages the component state and lifecycle, while D3’s `csv` loader fetches and parses the dataset. The chart applies the margin convention by translating a group element to offset the plotting area, with margins defined as a fixed object.

AI-generated description

A program that loads in some United Nations World Population Prospects 2019.