Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Overlapped Barchart9

Public visualization

Viewing a saved revision (read-only)

d9099475769946359fb440ab043a479e

Overlapped Barchart9

0 stars2🌍 Public
AAnimesh Nautiyal
Last edited May 19, 2021
Created on May 10, 2021

This visualization overlays a semi-transparent bar chart and a line graph to show changes in a percentage metric across overlapping time periods, with each bar labeled and tooltips revealing start and end dates. The React app loads JSON data containing survey periods (e.g., NFHS3, NFHS5) and uses d3.scaleTime, d3.scaleLinear, and d3.line to draw SVG elements. Animated hover interactions are handled via React’s onMouseOver and onMouseOut, while d3’s selection API manages the tooltip’s opacity transitions.

AI-generated description

React Starter code.