Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Axes with React & D3

Public visualization

Fork of Axes with React & D3

0 stars0🌍 Public
RRahel Gunaratne
Last edited May 19, 2021
Created on May 13, 2021

This example displays the top 10 most populous countries as horizontal bars, with axis ticks and labels rendered manually. The React component loads data from the UN World Population Prospects 2019 CSV via `d3.csv`, then uses `scaleBand` and `scaleLinear` to position bars and axes. D3’s `xScale.ticks()` generates grid lines, while SVG text elements draw tick labels. Rendering is done through React’s JSX within an SVG, replacing D3’s direct DOM manipulation.

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.

Comments

Sign in to join the discussion.

MIT Licensed