Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Selecting a Year on a Line Chart

Public visualization

Viewing a saved revision (read-only)

d2c3800e2cbe4fd793f2d22feb6bbf8b

Fork of Selecting a Year on a Line Chart

0 stars1🌍 Public
Cchandanagandla
Last edited Apr 8, 2023
Created on Apr 8, 2023

This interactive line chart displays global population trends over time for different regions, with lines colored by region and a vertical black line marking the currently selected year. Users can move the mouse across the chart to change the selected year, which updates the line position and triggers a re-render. The visualization uses d3 v5, including `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, `line`, and `curveBasis` to draw the axes and paths, with `nest` and `schemeCategory10` for grouping and coloring regions. Data is loaded from UN population estimates CSV files, processed by melting year columns into rows, and rendered using SVG with a custom line chart component that handles the mouse interaction via `on('mousemove')`.

AI-generated description