Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Making a Bar Chart with React and D3

Public visualization

Making a Bar Chart with React and D3

0 stars1🌍 Public
Aalexandermodell
Last edited Feb 22, 2022
Created on Feb 22, 2022

This example shows a horizontal bar chart ranking the top 10 countries by their 2020 population, rendered as SVG rectangles using React elements. The code loads CSV data from a GitHub gist using D3’s `csv` utility, then maps country names to y-coordinates via `scaleBand` and population values to x-widths via `scaleLinear`. Data loading and state management rely on React hooks (`useState`, `useEffect`), while D3 v7 provides the scales and `max` aggregation.

AI-generated description

A program that loads in some data using D3 utilities, and uses React render the data.

Comments

Sign in to join the discussion.

MIT Licensed