Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Activity 8_Q1.2

Public visualization

Viewing a saved revision (read-only)

b5966de0f71b427aa84beffc3f818ade

Activity 8_Q1.2

0 stars0🌍 Public
UUthkarsh Reddy Junuthula
Last edited Apr 11, 2024
Created on Apr 11, 2024
Forked from Activity 8_Q1.1

This example presents a horizontal bar chart of the top 20 countries by 2010 population, using a React component that renders SVG elements. It imports D3 v5 utilities such as `scaleBand`, `scaleLinear`, and `format` to construct the axes and tick labels, with data fetched as CSV from GitHub via D3’s `csv` function. The chart includes styled grid lines, light green bars, and a tooltip showing each country’s population, with axis components (`AxisBottom`, `AxisLeft`) and reusable `Marks` defined as separate ES6 modules.

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.