Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Activity 6_Task 1

Public visualization

Post on XLinkedIn

Viewing a saved revision (read-only)

5aa3074b11b44c3ab44fd7492afec8b6

Open

Activity 6_Task 1

0 stars0🌍 Public
Nnikhithadadi@my.unt.edu
Last edited Apr 5, 2024
Created on Apr 5, 2024
Forked from Hello VizHub

This visualization displays a horizontal bar chart comparing the populations of 30 countries for the year 2020, sourced from a GitHub-hosted CSV file. The bars are rendered as SVG rectangles using React, with D3 v5's `scaleBand` and `scaleLinear` for positioning along the categorical and linear axes. The chart’s axes are generated with the `AxisBottom` and `AxisLeft` components, which use D3’s scale ticks, and each bar includes a tooltip showing the population value formatted with `d3.format`. The data is loaded asynchronously via `d3.csv` and processed to multiply the 2020 values by 1000.

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.