Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Axes with React & D3

Public visualization

Viewing a saved revision (read-only)

296e68e0b8564a17a1e0142a90e3b2b2

Fork of Axes with React & D3

0 stars0🌍 Public
Ppinlin0816157
Last edited Sep 28, 2022
Created on Sep 28, 2022

This example displays a horizontal bar chart of the top 10 most populous countries for 2020, using data from the United Nations World Population Prospects 2019. The visualization renders as an SVG with both x- and y-axes, where the x-axis uses linear scaling and the y-axis uses band scaling. Built with React and D3 v5, the code employs `scaleLinear`, `scaleBand`, `max`, and `csv` to load and process the data, then manually generates axis ticks and gridlines as SVG elements. React state management handles the asynchronous data loading and conditional rendering.

AI-generated description

A program that shows the top 10 most populous countries as a pathetic bar chart with no axes.

Data: United Nations World Population Prospects 2019.