Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Activity8tutorial1

Public visualization

Viewing a saved revision (read-only)

a830faadef15458aa5a5ddfe1b967cb6

Activity8tutorial1

0 stars1🌍 Public
BBindumadhavi
Last edited Apr 14, 2024
Created on Apr 14, 2024
Forked from Activity 7

A horizontal bar chart displays population estimates for 30 countries in 2020, sourced from a CSV file loaded via `d3.csv`. The React-based visualization uses `d3.scaleBand` for the categorical y-axis and `d3.scaleLinear` for the numeric x-axis, with SVG rectangles rendered by the `Marks` component. Axes are built with custom `AxisBottom` and `AxisLeft` components, and tooltips use the native SVG `<title>` element. The x-axis labels are formatted using `d3.format` to abbreviate large numbers, converting 'G' to 'B' for billions.

AI-generated description

A demonstration of how to start using D3 version 6.