Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Margin Converntion

Public visualization

Viewing a saved revision (read-only)

f4e6b481fc644b5c9896f5aed9500784

Fork of Margin Converntion

0 stars1🌍 Public
SSamirAhma
Last edited Nov 25, 2022
Created on Nov 25, 2022
Forked from Margin Converntion

This example displays a horizontal bar chart of the top 10 countries by population for 2020, with labeled axes and tick marks. The visualization uses React state to asynchronously load CSV data via `d3.csv` and renders SVG elements. Margins are handled by transforming a group element, with `d3.scaleBand` positioning categories and `d3.scaleLinear` mapping population values to bar widths. The code constructs the bar chart with React components and d3 utilities, producing an interactive-ready visualization.

AI-generated description

A program that loads in some data about CSS named colors using D3 utilities, and uses React state to keep track of the data.