Skip to main content
100%

Fork of Axes with React & D3

✓ Published0🌍 Public
AAllen Wong
Last edited Mar 25, 2022
Created on Mar 25, 2022

This example shows the top 10 most populous countries as a bar chart with manually drawn axes, rendered as SVG. The code uses React hooks (useState and useEffect) to fetch and load CSV data from the United Nations World Population Prospects 2019 via d3.csv, then scales the bars with d3.scaleBand and d3.scaleLinear. Axes are constructed from xScale.ticks() and yScale.domain() to render gridlines, tick labels, and values. The visualization is purely declarative, with React managing the SVG elements and D3 handling data parsing and scales.

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.

MIT Licensed

Similar vizzes