# Waterfall chart

> From revenue to operating profit: steps up and down with total bars.

Source: https://82chart.com/en/docs/waterfall/

`type: 'waterfall'` reads values as steps: each bar starts where the previous one ended. A `{ total: true }` point is a total bar from zero; without `y` it shows the running total so far, with `y` it uses that value (start with `{ y: 1250, total: true }`). Dashed connectors join the bars and each bar gets its value (`+35`, `-260`).

```js
createChart('#chart', {
  type: 'waterfall',
  title: 'Operating profit bridge',
  subtitle: 'Q3 2026',
  prefix: '$',
  data: {
    labels: ['Revenue', 'Cost of sales', 'Gross profit', 'SG&A', 'Other income', 'Operating profit'],
    series: [{ name: 'Amount', data: [{ y: 12500, total: true }, -7800, { total: true }, -2600, 350, { total: true }] }],
  },
});
```

- Colors: by default (`deltaColors: 'semantic'`) increases are green and decreases red, swapped with `deltaUpIsGood: false`; `deltaColors: 'korea'` makes increases red and decreases blue. Total bars are gray (or the series `color`).
- The tooltip shows the step and the **running total** after it. The data table and CSV hold the computed totals.
- Value labels are on by default and skipped when wider than their band; `dataLabels: false` turns them off, `true` always writes them.