Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Activity6_tutorial-1

Public visualization

Viewing a saved revision (read-only)

9298ebf8a1f740b99b213aa7271672bf

Activity6_tutorial-1

0 stars0🌍 Public
Aamulyareddykondru01@gmail.com
Last edited Oct 22, 2024
Created on Oct 22, 2024
Forked from Hello VizHub

This visualization displays the top 30 countries by 2020 population using a horizontal bar chart rendered with SVG in a React application. The bars are populated from a CSV dataset, with population values formatted in billions using D3’s `format`. The chart uses `scaleBand` for the categorical country axis, `scaleLinear` for the quantitative population scale, and custom React components for the axes and marks. The code imports `csv`, `scaleBand`, and `scaleLinear` from d3.v5, while tooltips appear via SVG `<title>` elements on each rectangle.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.