Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

The Margin Convention

Public visualization

Viewing a saved revision (read-only)

6da6981ce791430f8644b0f3aa2665ce

The Margin Convention

0 stars2🌍 Public
Aangelathacker123
Last edited Feb 17, 2022
Created on Feb 17, 2022
Forked from Hello VizHub

This example demonstrates the margin convention in D3 by rendering a horizontal bar chart of the ten most populous countries from a UN population dataset. The chart uses React to manage state and render SVG elements, with D3’s scaleBand and scaleLinear used to map country names and population values to pixel coordinates. A `<g>` element translates the chart by the specified margins, ensuring the bars are positioned within the allotted inner dimensions. The data is loaded asynchronously via `d3.csv`.

AI-generated description

Uses React to render data