Skip to main content
๐ŸŒ Public

Share visualization

Send this visualization to others.

The Margin Convention

Public visualization

The Margin Convention

0 stars0๐ŸŒ Public
JJayesh Yadav
Last edited Nov 16, 2021
Created on Nov 16, 2021

This example visualizes a horizontal bar chart of population estimates for the top 10 countries, ordered by their 2020 population data from the United Nations. The chart uses a margin convention to properly size the plotting area, with rect elements positioned by d3.scaleBand for the y-axis and d3.scaleLinear for the x-axis. The visualization is built with React (using hooks for state and effects) and renders to SVG, with data loaded asynchronously via d3.csv.

AI-generated description

Smiley face implementation with React.

Comments

Sign in to join the discussion.

MIT Licensed