Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Overlapped Barchart

Public visualization

Overlapped Barchart

0 stars1🌍 Public
AAnimesh Nautiyal
Last edited Apr 22, 2021
Created on Apr 22, 2021
Forked from React Starter

This visualization uses a React component to render an overlapped barchart in SVG, displaying percentage values across five time periods from survey data. The code loads JSON data via d3.json, then constructs scales with d3.scaleBand and d3.scaleLinear to map time periods and values to x and y coordinates. Overlapping bars are drawn as semi-transparent green rectangles with rgba(200,255,220,.9) fill, allowing underlying bars to show through when values decrease over time. The chart omits axis labels and focuses solely on the bar geometry, with data sourced from the timeperiod.json file.

AI-generated description

React Starter code.

Comments

Sign in to join the discussion.

MIT Licensed