HAHS.
Back to Catalog

Waterfall Chart

chart

Also known as: bridge chart, cascade chart, flying bricks chart, Mario chart

Show compositionShow change over timeCompare CategoricalNumerical Bar/Column

Description

A waterfall chart shows how an initial value is incrementally modified by a series of positive or negative changes to arrive at a final value. Each bar “floats” — its bottom edge starts where the previous bar’s top edge ended — creating a staircase or cascade effect. Positive contributions are typically colored green (or a warm hue), negative contributions red (or a cool hue), and total bars (start and end) are colored in a neutral tone.

Waterfall charts are a staple of financial reporting, where they explain how revenue becomes net income through a sequence of additions (other income, gains) and subtractions (expenses, taxes, write-offs). They are equally useful for any domain where a starting quantity undergoes a series of adjustments: population change (births minus deaths plus migration), inventory reconciliation, or project budget tracking.

The visual metaphor of “building up and tearing down” makes the chart intuitive even for audiences unfamiliar with the format. The floating bars immediately show whether each step is additive or subtractive, and the cumulative running total is readable from the top edge of each bar. Connector lines between bars reinforce the cascade relationship and help the eye track the running total.

Waterfall Chart — interactive example

When to Use

  • Explaining how an initial total changes through a series of positive and negative adjustments to reach a final total
  • Financial reporting: revenue to net income, opening to closing balance, budget variance analysis
  • Decomposing a total into contributing factors (e.g., what drove the change in market share)
  • Showing cumulative impact of sequential events

When NOT to Use

  • When there is no meaningful sequential or cumulative relationship between the values — use a bar chart
  • When you want to compare independent categories without a running total — use a bar chart or dot plot
  • When the number of steps is very large (>15) — the chart becomes hard to read; consider grouping categories
  • When the audience needs to see proportions — use a stacked bar chart or pie chart

Anatomy

  • Floating bars: Rectangular bars that start at the running total, not at zero. Height encodes the magnitude of each change.
  • Total bars: Bars anchored at zero for the starting and ending totals, providing reference points
  • Color coding: Positive changes, negative changes, and totals each receive a distinct color
  • Connector lines: Thin lines from the top of one bar to the bottom of the next, showing the cascade
  • Category axis: Labels for each step in the sequence
  • Value axis: The quantitative scale; the running total can be read from bar endpoints

Variations

  • Horizontal waterfall: Bars flow left-to-right instead of bottom-to-top, useful for long labels
  • Stacked waterfall: Each step is further decomposed into sub-components
  • Variance waterfall: Shows the difference between two scenarios (e.g., budget vs. actual)
  • Waterfall with subtotals: Intermediate total bars inserted at logical breakpoints (e.g., gross profit, operating income)
  • Sorted waterfall: Steps reordered by magnitude rather than natural sequence, highlighting the biggest drivers

Code Reference

// Observable Plot - waterfall via computed y1/y2
const steps = data.reduce((acc, d) => {
  const prev = acc.length ? acc[acc.length - 1].y2 : 0;
  acc.push({...d, y1: prev, y2: prev + d.value});
  return acc;
}, []);

Plot.plot({
  marks: [
    Plot.barY(steps, {
      x: "label", y1: "y1", y2: "y2",
      fill: d => d.value >= 0 ? "#22c55e" : "#ef4444",
      tip: true
    }),
    Plot.ruleY([0])
  ]
})