LineSeriesView.StackedMode Property
Specifies whether line series points are stacked when shown for the same argument.
Namespace: DevExpress.WinUI.Charts
Assembly: DevExpress.WinUI.Charts.v23.2.dll
NuGet Package: DevExpress.WinUI
#Declaration
[DP(StackedMode.None, Handler = "ViewTypeChanged")]
public StackedMode StackedMode { get; set; }
#Property Value
Type | Description |
---|---|
Stacked |
A value that defines how line series points are stacked. |
Available values:
Name | Description | Image |
---|---|---|
None | Points are displayed side-by-side. |
|
Stacked | Points shown for the same argument are stacked. Values are summarized. |
|
Full |
Points shown for the same argument are stacked. A stacked group height is equal to the y-axis length. Point values are shown as a percentage where 100% is the sum of all values associated with the argument. |
#Remarks
The following example shows how to create a stacked line chart. In this example, series are created based on a collection of series view models.
- Use the ChartBase.SeriesSource property to bind the chart to a collection that contains series view models.
Define the ChartBase.SeriesItemTemplate property to specify how to convert view model objects to series. To do this, initialize the
SeriesItemTemplate
property with aDataTemplate
object. Add a Series object to the data template.Note: Use the ChartBase.SeriesItemTemplateSelector property if you need to select a series template based on a condition.
Then, you need to specify how series obtain data from the source. To do this, initialize the Series.Data with a DataSource object. Specify the following data source properties:
- To visualize data source points as lines, set the Series.View property to a LineSeriesView object. To stack line series points shown for the same argument, set the
StackedMode
property to Stacked.
<Window
x:Class="StackedSeriesChart.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:StackedSeriesChart"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:Charts="using:DevExpress.WinUI.Charts"
mc:Ignorable="d">
<Grid>
<Grid.DataContext>
<local:ChartViewModel/>
</Grid.DataContext>
<Charts:CartesianChart x:Name="chart"
ToolTipEnabled="True"
SeriesSource="{Binding SeriesData}"
Width="700" Height="360">
<Charts:CartesianChart.SeriesItemTemplate>
<DataTemplate>
<Charts:Series DisplayName="{Binding Name}">
<Charts:Series.Data>
<Charts:DataSource PointSource="{Binding DataPoints}"
ArgumentDataMember="Argument"
ValueDataMember="Value"/>
</Charts:Series.Data>
<Charts:Series.View>
<Charts:LineSeriesView StackedMode="Stacked"
ShowLabels="True"
LabelPattern="{}${V}K"/>
</Charts:Series.View>
</Charts:Series>
</DataTemplate>
</Charts:CartesianChart.SeriesItemTemplate>
<Charts:CartesianChart.AxisX>
<Charts:AxisX SideMargins="0.2"/>
</Charts:CartesianChart.AxisX>
<Charts:CartesianChart.Legend>
<Charts:Legend />
</Charts:CartesianChart.Legend>
</Charts:CartesianChart>
</Grid>
</Window>
using DevExpress.Mvvm;
using Microsoft.UI.Xaml;
using System.Collections.Generic;
namespace StackedSeriesChart {
public sealed partial class MainWindow : Window {
public MainWindow() {
this.InitializeComponent();
}
}
public class ChartViewModel : ViewModelBase {
public List<SeriesViewModel> SeriesData { get; }
public ChartViewModel() {
List<SeriesViewModel> seriesData = new List<SeriesViewModel> {
new SeriesViewModel{ Name = "Canada", Group = 0,
DataPoints = new List<DataPoint> {
new DataPoint{ Argument = "March", Value = 125.45 },
new DataPoint{ Argument = "April", Value = 144.3 },
new DataPoint{ Argument = "May", Value = 133.54 }
}
},
new SeriesViewModel{ Name = "USA", Group = 0,
DataPoints = new List<DataPoint> {
new DataPoint{ Argument = "March", Value = 122.36 },
new DataPoint{ Argument = "April", Value = 126.87 },
new DataPoint{ Argument = "May", Value = 128.33 }
}
},
new SeriesViewModel{ Name = "France", Group = 1,
DataPoints = new List<DataPoint> {
new DataPoint{ Argument = "March", Value = 56.32 },
new DataPoint{ Argument = "April", Value = 58.63 },
new DataPoint{ Argument = "May", Value = 59.14 }
}
},
new SeriesViewModel{ Name = "Germany", Group = 1,
DataPoints = new List<DataPoint> {
new DataPoint{ Argument = "March", Value = 62.12 },
new DataPoint{ Argument = "April", Value = 69.123 },
new DataPoint{ Argument = "May", Value = 75.11 }
}
},
new SeriesViewModel{ Name = "Austria", Group = 1,
DataPoints = new List<DataPoint> {
new DataPoint{ Argument = "March", Value = 42.852 },
new DataPoint{ Argument = "April", Value = 41.77 },
new DataPoint{ Argument = "May", Value = 39.25 }
}
}
};
SeriesData = seriesData;
}
}
public class SeriesViewModel {
public int Group { get; set; }
public string Name { get; set; }
public List<DataPoint> DataPoints { get; set; }
}
public class DataPoint {
public string Argument { get; set; }
public double Value { get; set; }
}
}