Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Activity 6_Task

Public visualization

Viewing a saved revision (read-only)

2393666ebb034187a9fbf64275d6d076

Activity 6_Task

0 stars0🌍 Public
VVasanth Krishna
Last edited Oct 22, 2024
Created on Oct 22, 2024
Forked from Hello VizHub

This interactive bar chart displays the 2020 population estimates for the top 30 countries, ranked by country name along the y-axis and population size on the x-axis using a linear scale. Built with React and rendered as an SVG, the visualization uses D3 v5 APIs such as `scaleBand` for the categorical y-axis and `scaleLinear` for the continuous x-axis. The code fetches CSV data from an external GitHub URL, formats population values with the `format` function (converting billions to “B”), and provides hover tooltips via SVG `<title>` elements. The styling includes green bars, blue tick lines, and the Poppins font.

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.