Stacked Area Chart

Multiple line series with each area filled and stacked on top of the others, so the top edge represents the running total while the colored bands show how each component contributes to it over time. Built with Chart.js using stacked y-axes and per-series fill, with smooth curves

Template details

  • chart
  • area
  • stacked
  • timeseries
  • composition
  • chartjs

When to use this template

A stacked area chart effectively illustrates how individual components contribute to a changing total over time. Analysts use it to understand the proportional breakdown of a whole, revealing trends in both the overall sum and the relative share of each part. It is ideal for tracking how a composition evolves.

  • Time-series data with a clear chronological progression
  • Multiple categorical series contributing to a single total
  • Quantitative values that are additive and non-negative
  • Datasets where component proportions change significantly over time
  • Regular, consistent time intervals for the x-axis
  • Moderate number of series (e.g., 3-8) for optimal readability

Browse all Koan templates