Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Activity6_task1

Public visualization

Viewing a saved revision (read-only)

6b4a81e110f7471ebd7e75a92869db50

Activity6_task1

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

This example displays a horizontal bar chart comparing the 2020 populations of 30 countries, using D3 v5 and React to render the visualization as an SVG. The code imports `scaleBand`, `scaleLinear`, `format`, and `csv` from D3 to process the remote CSV data and map each country to a proportional green bar. Custom `AxisBottom`, `AxisLeft`, and `Marks` components generate the axes and rectangles, with tooltips showing formatted population values. The chart includes blue tick lines and labels for the “POPULATION-2020” axis.

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.