Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Selecting a Year on a Line Chart

Public visualization

Selecting a Year on a Line Chart

0 stars0🌍 Public
家家兴
Last edited Feb 12, 2020
Created on Feb 12, 2020

This interactive line chart displays global population trends by region from 1950 to 2100, using data from United Nations population estimates. A vertical line highlights the currently selected year, and hovering over the chart updates the selection to the nearest year. The visualization builds on d3.csv, d3.nest, d3.scaleTime, d3.scaleLinear, and d3.line for rendering SVG paths, with a custom d3.colorLegend for the categorical color scale. The selected year is stored in a state variable and triggers a re-render on change.

AI-generated description

Comments

Sign in to join the discussion.

MIT Licensed