Skip to main content
100%

Axes with React & D3

✓ Published1🌍 Public
TTroy Marchesseault
Last edited May 15, 2023
Created on May 15, 2023

This example renders a horizontal bar chart of 2020 population estimates for ten countries in SVG. Data is loaded from a CSV file using `d3.csv`, and React uses `useState` and `useEffect` to manage the asynchronous fetch. D3 scales (`scaleBand`, `scaleLinear`) compute bar positions and widths, while axis ticks are generated manually from `xScale.ticks()` with rendered lines and text. The chart displays country labels on the left and value ticks below the bars.

AI-generated description

A program that loads in some data about country populations using D3 utilities, and uses React to render the data as a bar chart.

MIT Licensed

Similar vizzes