How to create a waterfall chart

A waterfall chart is often used in accounting contexts to understand how positive and negative values accumulate. The waterfall chart is also known as a flying bricks chart, Mario chart or bridge.

Datawrapper doesn't offer an official waterfall chart type. However, it's possible to create one with our stacked column chart type:

This article explains how. 

Prepare the data

The trick of creating a waterfall chart with a stacked column chart is to make those bar sections transparent that "carry" the upper bar sections. Here's how the data needs to look for that: 

The "white space" category is what will be transparent in the final chart. This category turns your column chart into a waterfall chart. These numbers (420000 for "Services Revenue", for example) define the empty space between the bottom of the chart and your bar sections.

Keep the cells empty that you don't want to define. If you add a "0" to these empty cells, they will show up when you display your values in the final chart.

You can add as many categories as you like besides the "transparent" category – in our case, we have a "positive", "negative" and "total" category. Because they are in different categories, we will be able to color these bar sections differently in the final chart. 

Create the chart

If you're new to Datawrapper, go to https://www.datawrapper.de/ and click on Start creating. Then simply copy & paste your data into Step 1: Upload data.

In Step 3: Visualize, choose the Stacked Column Chart.

Then go to the Refine tab to adjust your chart. 

First, customize your colors below Appearance. Click on customize colors..., then select the category which color you want to change. 

Now comes the important part: Make the "white space" category transparent. To do so, select any color (e.g. white, #ffffff) and then add a 00 at its end (#ffffff00). These last two numbers set the opacity of your color. Choosing 00 makes it 0% opaque = 100% transparent.

Change the colors of the other categories to your liking – e.g. a dark red for positive values and light green for negative values. 

All that's left to do is to turn off category labels, and change the Show values settings to always, if you want to. 

Now give your chart a good title and description in the Annotate tab before publishing it in Step 4: Publish. From there, you can embed your waterfall chart in your website or export it as a PNG, PDF or SVG.