Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

visualize with react Bar chart

Public visualization

Viewing a saved revision (read-only)

5537f1f356f1431999636ac54c46ca1d

visualize with react Bar chart

0 stars1🌍 Public
Aaparnasj-sj
Last edited Oct 8, 2023
Created on Oct 8, 2023

This bar chart uses React to render a horizontal bar chart of the top 10 countries by projected 2020 population, sourced from the UN Population 2019 dataset. The visualization shows population values as bar lengths on an SVG canvas. The code uses React's `useEffect` and `useState` hooks to asynchronously load and parse the CSV data with `d3.csv`, while `d3.scaleBand` and `d3.scaleLinear` map the categorical country names and numeric populations to pixel coordinates. React DOM (`ReactDOM.render`) mounts the component into the HTML root element.

AI-generated description

use react to render data d3 to generate bar chart