Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

activity 6_task 1

Public visualization

Viewing a saved revision (read-only)

1aee53328fbe4917b01508fe573790f8

activity 6_task 1

0 stars0🌍 Public
Bbrahmateja.edu2023@gmail.com
Last edited Apr 10, 2024
Created on Apr 10, 2024
Forked from activity

This example shows a horizontal bar chart of population data for 20 countries in 2010, with each bar labeled by country name and sized by population value. The visualization uses React to render SVG elements, with D3’s `scaleBand` and `scaleLinear` for positioning, and `format` to abbreviate axis tick labels (converting "G" to "B" for billions). Data loads from a remote CSV file via `d3.csv` in a custom `useData` hook. The code also defines reusable axis and mark components, and includes tooltips on each bar using SVG `<title>` elements.

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.