Skip to main content
100%

Axes with React and D3

✓ Published1🌍 Public
Fforcox43
Last edited Sep 8, 2020
Created on Sep 4, 2020

This example visualizes the top 10 countries by 2020 population as horizontal bars, displaying the data as text labels and bars using React components and D3 scales. The code builds SVG elements from scratch, using `scaleBand` for the y-axis country labels and `scaleLinear` for the x-axis population values, with axis ticks rendered manually. It loads UN population data from a CSV file via `d3.csv` and uses React hooks like `useState` and `useEffect` to fetch and render the data, with the final chart presented as an interactive SVG graphic.

AI-generated description

A program that loads and parses some CSV data: CSS Named Colors.

MIT Licensed

Similar vizzes