Skip to main content
100%

Testing UseEffect

✓ Published0🌍 Public
Sseanmdalrymple@protonmail.com
Last edited Feb 11, 2025
Created on Feb 11, 2025

This example demonstrates the top 10 most populous countries in 2020 from the United Nations World Population Prospects 2019 dataset, displayed as a bar chart without axes using React and D3. The code loads CSV data with d3.csv, converts population strings to numbers, and slices the dataset to the first ten entries. It uses React hooks (useState, useEffect) to handle asynchronous data loading, then renders an SVG with scaleBand, scaleLinear, and explicit x- and y-axis tick marks created from d3.scaleLinear’s `.ticks()` method. The chart updates once data arrives, showing a loading message initially.

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