How to: Create a 2D Stacked Line Chart

• Jun 07, 2019

The following example demonstrates how to create a Stacked Line chart. To do this, it is necessary to assign the ChartControl.Diagram property to XYDiagram2D, and then add two LineStackedSeries2D objects with points to the diagram’s Diagram.Series collection.

Also, this example shows how to add a chart title.

MainWindow.xaml

<Window x:Class="LineStacked2DChart.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:dxc="http://schemas.devexpress.com/winfx/2008/xaml/charts"
        Title="MainWindow" Height="400" Width="600" >
    <Grid>
        <dxc:ChartControl>
            <dxc:ChartControl.Diagram>
                <dxc:XYDiagram2D>
                    <dxc:XYDiagram2D.Series>
                        <dxc:LineStackedSeries2D >
                            <dxc:LineStackedSeries2D.Points>
                                <dxc:SeriesPoint Argument="Illinois" Value="423.721" />
                                <dxc:SeriesPoint Argument="Indiana" Value="178.719" />
                                <dxc:SeriesPoint Argument="Michigan" Value="308.845" />
                                <dxc:SeriesPoint Argument="Ohio" Value="348.555" />
                                <dxc:SeriesPoint Argument="Wisconsin" Value="160.274" />
                            </dxc:LineStackedSeries2D.Points>
                        </dxc:LineStackedSeries2D>
                        <dxc:LineStackedSeries2D >
                            <dxc:LineStackedSeries2D.Points>
                                <dxc:SeriesPoint Argument="Illinois" Value="476.851" />
                                <dxc:SeriesPoint Argument="Indiana" Value="195.769" />
                                <dxc:SeriesPoint Argument="Michigan" Value="335.793" />
                                <dxc:SeriesPoint Argument="Ohio" Value="374.771" />
                                <dxc:SeriesPoint Argument="Wisconsin" Value="182.373" />
                            </dxc:LineStackedSeries2D.Points>
                        </dxc:LineStackedSeries2D>
                    </dxc:XYDiagram2D.Series>
                    <dxc:XYDiagram2D.AxisY>
                        <dxc:AxisY2D>
                            <dxc:AxisY2D.Title>
                                <dxc:AxisTitle Content="Millions of Dollars" />
                            </dxc:AxisY2D.Title>
                        </dxc:AxisY2D>
                    </dxc:XYDiagram2D.AxisY>
                </dxc:XYDiagram2D>
            </dxc:ChartControl.Diagram>
            <dxc:ChartControl.Titles>
                <dxc:Title Dock="Top" HorizontalAlignment="Center">Great Lakes Gross State Product</dxc:Title>
            </dxc:ChartControl.Titles>
        </dxc:ChartControl>
    </Grid>
</Window>