Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Activity 6_1

Public visualization

Viewing a saved revision (read-only)

4bc83411983a451f93bb77e8d9d80d70

Activity 6_1

0 stars1🌍 Public
Jjayanthbalina@gmail.com
Last edited Apr 3, 2024
Created on Apr 3, 2024
Forked from Activity 6

A horizontal bar chart displays the populations of ten countries in 2020, sorted by country name along the y-axis and using a linear population scale on the x-axis. Built with React and D3 v5, the visualization uses `d3.scaleBand` for categorical positioning and `d3.scaleLinear` for the continuous population mapping, while `d3.format` transforms tick labels from gigabytes to billions. Data is loaded asynchronously from a CSV file via `d3.csv`. SVG rectangles render the bars, with hover tooltips showing formatted population values. Axis components are custom React functions, and styling is applied through CSS classes.

AI-generated description

A demonstration of how to start using D3 version 6.