Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Test StreamGraph

Public visualization

Viewing a saved revision (read-only)

ba702a31d7ac4b5484024356e9ea5806

Test StreamGraph

0 stars0🌍 Public
NNicoA
Last edited Nov 4, 2023
Created on Nov 4, 2023

This visualization shows the popularity of eight baby names (Amanda, Ashley, Betty, and others) over time using a streamgraph with stacked, layered areas. The React component wraps D3 v5 APIs including `stack`, `area`, `curveBasis`, `stackOffsetSilhouette`, and `stackOrderInsideOut`. It uses `scaleOrdinal` with the `schemeDark2` color palette and `scaleLinear` for axes. Hovering over a stream highlights that category and displays its name in a tooltip, while non-hovered streams fade to 20% opacity. The data comes from the provided CSV dataset containing yearly name counts.

AI-generated description

This is a recreation of the Streamgraph template. It is rewritten to use React instead of only d3, if you come from the 2021 Data Visualization course, this template will be more understandable for you.