Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

The margin convention on bar chart

Public visualization

The margin convention on bar chart

0 stars1🌍 Public
Cchrismeeky
Last edited Oct 18, 2021
Created on Oct 18, 2021
Forked from Pathethic Barchart

This example demonstrates the margin convention in bar charts, showing how to position axes and plot marks within a designated plotting area. It uses React to render SVG elements and d3’s `scaleBand` and `scaleLinear` to map countries and population values from a CSV loaded via `d3.csv`. Grid lines and tick labels are generated from `xScale.ticks()`, with the plot group translated by a specified margin inset from the SVG viewport.

AI-generated description

Loads external data using d3's csv utility and renders on a "pathetic" barchart

Comments

Sign in to join the discussion.

MIT Licensed