> For the complete documentation index, see [llms.txt](https://docs.bdb.ai/governed-dashboards-5/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.bdb.ai/governed-dashboards-5/charts-gallery/charts/waterfall-chart.md).

# Waterfall Chart

A Waterfall Chart is a form of data visualization that helps in understanding the cumulative effect of sequentially introduced positive or negative values. The waterfall chart is also known as a flying bricks chart or Mario chart due to the apparent suspension of columns (bricks) in mid-air. The Waterfall Chart is used to show how an initial value is increased and decreased by a series of intermediate values, leading to a final value.

## **Best Situations to Use Waterflow chart**

To show incremental changes in the values over time.

### **Default Chart Image**

<figure><img src="https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FcdYAsZbEoljokyxgRgAM%2Fwaterfall_default.png?alt=media&#x26;token=2d151cec-4b62-4f27-bf21-8b755c285bed" alt=""><figcaption></figcaption></figure>

## **Properties of the Waterfall Chart**

### **General**

The user can change the height, width, top, and left values. If initial visibility is not enabled, then the chart will not be available for the first preview. If the Max Button is enabled, then the user can maximize the chart. The user can change the base type between Plain, Gradient 1, Gradient 2, and Gradient 3. The user can set colors for positive, negative, and Total Values. It is also possible to adjust the bar size.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/T8ZgTJgF6sqqwxhflCMD/image.png" alt=""><figcaption></figcaption></figure>

### **Tooltip**

If the user wants to show the description of the series can use the tooltip by enabling it.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/DogJat9F5XriP00I8Rl3/image.png" alt=""><figcaption></figcaption></figure>

### **Background**

The user can get the reflection of the chart by enabling the shadow option can also change the color and increase & decrease the transparency of the shadow. The user can also change the background color, adjust its transparency as well as enable a border and change its color.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/idiT2qKoGZt1V2Z64ncs/image.png" alt=""><figcaption></figcaption></figure>

### **Title**

The user can change Title Name, Font color, font size, font style, etc.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/aNpCnzcnRhSCLaLQCjeT/image.png" alt=""><figcaption></figcaption></figure>

### **Subtitle**

The user can enable the subtitle there is any second title. The user can change the name, font color, font size, font style, etc.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/ZzdVtZQrdqmIEBLJxdtU/image.png" alt=""><figcaption></figcaption></figure>

### **X-Axis**

The user can show the x-axis line, change the x-axis line color, label color, font size, font weight, font family, description, etc. The user can rotate the label using the X-Axis.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/0LPlAGHQINeCFQvgToJY/image.png" alt=""><figcaption></figcaption></figure>

### **Y-Axis**

The user can show the y-axis line, change the y-axis line color, label color, font size, font weight, font family, description, etc.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/vk1gDqBSrXrWaFe42VR4/image.png" alt=""><figcaption></figcaption></figure>

### **Legend**

The user can enable the internal legend to show and change the font size, font color, font style, etc.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/vr5FUiARAFYJCkGvVWZl/image.png" alt=""><figcaption></figcaption></figure>

### **Formatter**

The user can change units to % or none. The user can set the Precision option to see value in decimal format. The user can display currency value in INR, Pound, USD. The position of the currency symbol can be set as Prefix (if the currency is in INR format) otherwise, it can appear on the right-side as Suffix. Number Formatter can set it in Indian or International.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/yfw6YcsLVQPA1OT3deqr/image.png" alt=""><figcaption></figcaption></figure>

### **Axis Setup**

The user can either set up the base as zero or else set up another minimum value. The user can include horizontal Marker lines as well as Vertical marker lines and change their color.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/lpelPFxClyeYXwMqJNMk/image.png" alt=""><figcaption></figcaption></figure>

### **Export Options**

The Export Options also helps to provide heading, subheading, file name. The user can also select an option for ***Global Export Type***.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/k3KTjvCU2cneWG9B779n/image.png" alt=""><figcaption></figcaption></figure>

The user can enable the ***Enable Context Menu*** from the preview section to download the reports in different formats.

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/lPjKDDxGAuOaj85GK8Ag/image.png" alt=""><figcaption></figcaption></figure>

## **Dataset Property**&#x20;

The users can map a dataset with the dragged Waterfall chart component, and map the data fields as displayed in the given image:

![](https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FVcC5oBVKS2e2DFPDxGBs%2Fwaterfall_connection.png?alt=media\&token=9b037251-6ffb-401a-9b0c-439cf02191f6)

## **Waterfall charts after changing its properties**

**Base Type with Plain**

<figure><img src="https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FBwpBCRYbceX5V0UeIYhz%2Fwaterflow_plain.png?alt=media&#x26;token=ffb4b2c7-20bb-4262-b329-6db2ef792dee" alt=""><figcaption></figcaption></figure>

**Base Type with Gradient 1**

<figure><img src="https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2Fnee7HV8DApoUivJS80L0%2Fwaterfall_gradient1_basetype.png?alt=media&#x26;token=5d4f4f1f-cfce-4019-95fe-3212849af91a" alt=""><figcaption></figcaption></figure>

**Base Type with Gradient 2**

<figure><img src="https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2F0ToKys0LyJ8D1YKtKOa2%2Fwaterfall_gradient2.png?alt=media&#x26;token=c3c955bf-17de-470f-8601-0dcf1cdaeea2" alt=""><figcaption></figcaption></figure>

**Base Type with Gradient 3**

<figure><img src="https://content.gitbook.com/content/nyOeUTaPuBluyvesHVm9/blobs/kyMjrEd0QSbDCdM56zuK/image.png" alt=""><figcaption></figcaption></figure>

## Sample Data&#x20;

Download the given sample data and map it as mentioned below to plot your ***Waterfall*** chart.&#x20;

Select the ***Year*** column as ***Category*** field and ***Expense*** or ***Revenue*** column as ***Series*** field to plot the data.

{% file src="/files/CQFBavqbs9SOHeE4INV3" %}

{% hint style="info" %}
*<mark style="color:green;">Please Note:</mark> The Waterfall chart supports only one series field.*
{% endhint %}