Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Dataviz 6 - Axes with React and D3

Public visualization

Viewing a saved revision (read-only)

a339446e56324e788f61ee9f7fa7bae0

Dataviz 6 - Axes with React and D3

0 stars1🌍 Public
RRyAlpha
Last edited Nov 24, 2021
Created on Nov 24, 2021

This example displays the top 10 most populous countries as a horizontal bar chart, with axes manually constructed using React and D3 v5. The chart shows population values on a linear x-axis and country names on a band y-axis, both built from `d3.scaleLinear` and `d3.scaleBand`. Data comes from the United Nations World Population Prospects 2019, loaded via `d3.csv`. The visualization renders as SVG, with tick marks and labels generated by mapping over `xScale.ticks()` and the y-scale domain.

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.