🌍 Public
Viewing a saved revision (read-only)
86b36f634de3416293918d1c712a5ab1
Activity6 Tutorial 1
This example shows a horizontal bar chart of population estimates for 30 countries in 2020, using a React-based SVG rendering approach. The visualization uses `scaleBand` and `scaleLinear` to map country names and population values to screen coordinates, with formatted tick labels converting values to billions. The code loads CSV data via `d3.csv`, applies a custom row-parsing function, and renders the bars using generated `rect` elements with hover tooltips provided by SVG `<title>` elements. Axes are constructed as separate React components that generate tick marks and labels using D3's scale methods.
AI-generated descriptionAn example showing the capabilities of VizHub:
- Loads D3 via UNPKG.
- Demonstrates use of
importfrom"d3". - Demonstrates use of
importfrom local ES6 modules.