# Waterfall Charts

You can add a waterfall chart to your spreadsheet using Spread for ASP.NET. Learn more in documentation.

## Content

A waterfall chart can be used to show how an initial value is affected by negative or positive values. Columns are color coded so you can quickly see differences between positive and negative values. Some values start on the horizontal axis, while intermediate values are shown as floating columns.
![Waterfall Chart](https://cdn.mescius.io/document-site-files/images/346c9178-0ed8-4fb9-908b-1565b22fb408/artwork/webwaterfall.png)
For information about creating charts in the Spread Designer or the Chart Designer, refer to [Using the Spread Designer](/spreadnet/docs/latest/online-asp/overview/spweb-devguide/spweb-chart/spweb-chartcreate/spweb-chartsd) or [Using the Chart Designer](/spreadnet/docs/latest/online-asp/overview/spweb-devguide/spweb-chart/spweb-chartcreate/spweb-chartdesigner).

## Using Code

1. Use the [WaterfallSeries](/spreadnet/api/latest/online-asp/FarPoint.Web.Chart/FarPoint.Web.Chart.WaterfallSeries.html) class to add data to a Chart control.
2. Use the [YPlotArea](/spreadnet/api/latest/online-asp/FarPoint.Web.Chart/FarPoint.Web.Chart.YPlotArea.html) class to create a plot area.
3. Set the location and size of the plot area.
4. Add the series to the plot area.
5. Create a chart model and add the plot area to the model.
6. Create a chart and add the chart model to it.
7. Add the chart to the Spread control.

## Example

The following example creates a waterfall chart.

```csharp
FarPoint.Web.Chart.WaterfallSeries wseries = new FarPoint.Web.Chart.WaterfallSeries();
wseries.SeriesName = "Series0";
wseries.Values.Add(10);
wseries.Values.Add(-5);
wseries.Values.Add(-1);
wseries.Values.Add(4);
wseries.Borders.Add(new FarPoint.Web.Chart.SolidLine(System.Drawing.Color.Black));
wseries.Borders.Add(new FarPoint.Web.Chart.SolidLine(System.Drawing.Color.Black));

FarPoint.Web.Chart.YPlotArea plotArea = new FarPoint.Web.Chart.YPlotArea();
plotArea.Location = new System.Drawing.PointF(0.2f, 0.2f);
plotArea.Size = new System.Drawing.SizeF(0.6f, 0.6f);
plotArea.Series.Add(wseries);
FarPoint.Web.Chart.ChartModel model = new FarPoint.Web.Chart.ChartModel();
model.PlotAreas.Add(plotArea);

FarPoint.Web.Spread.Chart.SpreadChart chart = new FarPoint.Web.Spread.Chart.SpreadChart();
chart.Model = model;
FpSpread1.Sheets[0].Charts.Add(chart);
```

```vbnet
Dim wseries = New FarPoint.Web.Chart.WaterfallSeries()
wseries.SeriesName = "Series0"
wseries.Values.Add(10)
wseries.Values.Add(-5)
wseries.Values.Add(-1)
wseries.Values.Add(4)
wseries.Borders.Add(New FarPoint.Web.Chart.SolidLine(System.Drawing.Color.Black))
wseries.Borders.Add(New FarPoint.Web.Chart.SolidLine(System.Drawing.Color.Black))

Dim plotArea As New FarPoint.Web.Chart.YPlotArea()
plotArea.Location = New System.Drawing.PointF(0.2F, 0.2F)
plotArea.Size = New System.Drawing.SizeF(0.6F, 0.6F)
plotArea.Series.Add(wseries)
Dim model As New FarPoint.Web.Chart.ChartModel()
model.PlotAreas.Add(plotArea)

Dim chart As New FarPoint.Web.Spread.Chart.SpreadChart()
chart.Model = model
FpSpread1.Sheets(0).Charts.Add(chart)
```

## Using the Chart Designer

1. Select the **PlotArea Collection** editor.
2. Set properties as needed.
3. Select **Apply** and **OK** to close the Chart Designer.