Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

The Margin Convention

Public visualization

Viewing a saved revision (read-only)

97366484ca3344bb973fee23d02eaea9

The Margin Convention

0 stars1🌍 Public
Hhung2606
Last edited Oct 14, 2021
Created on Oct 14, 2021
Forked from Pathetic Bar Chart

This example shows a bar chart of the top 10 most populous countries from the United Nations World Population Prospects 2019 dataset, with the bars rendered using React and SVG. It demonstrates the margin convention by defining a `margin` object and using it to offset an inner `<g>` group, allowing the chart to fit within a 960×500 viewport. The code uses `d3.scaleBand` for the y-axis, `d3.scaleLinear` for the x-axis, and `d3.csv` to load and parse the data. Notably, the chart lacks axes, making it intentionally primitive and focusing purely on the spatial layout.

AI-generated description

A program that shows the top 10 most populous countries as a pathetic bar chart with no axes.

Data: United Nations World Population Prospects 2019.