Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Activity 6

Public visualization

Viewing a saved revision (read-only)

637e5b2ff0a34369ade9664199745201

Activity 6

0 stars0🌍 Public
Mm.maanvireddt761@gmail.com
Last edited Oct 22, 2024
Created on Oct 22, 2024
Forked from Activity 6

This example shows a horizontal bar chart comparing the 2020 population of 30 countries. The chart uses D3.js v5 scales to map country names and population values to the SVG canvas, with each bar's length proportional to its population. The bars are rendered as SVG rectangles, and hovering over a bar displays its formatted population value in a tooltip. The React application loads the data from a remote CSV file and uses D3's `scaleBand` and `scaleLinear` for positioning, with custom axis components for the bottom and left edges.

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.