Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Bar Chart

Public visualization

Viewing a saved revision (read-only)

68f08df073f1409da25930de97fb947b

Bar Chart

0 stars1🌍 Public
CCarlos Caballero
Last edited Mar 2, 2021
Created on Mar 2, 2021
Forked from css named colors

This example displays a horizontal bar chart of 2020 population estimates for the top 10 countries, sourced from UN Population Prospects data loaded via d3.csv (d3-fetch). The React 17 app uses d3.scaleBand for the country axis and d3.scaleLinear for population, rendering SVG rectangles with native `<title>` tooltips. Axes are built manually through React components (AxisBottom, AxisLeft), while d3.format formats population values with SI notation, converting 'G' to 'B'. The chart is styled with a teal fill and Poppins font.

AI-generated description

use react, d3, to parse and visualize data about un population prospects