How to create separate columns' StackedGroup in the Stacking Series?
Description
Stacking series can be rendered like a pile of coins that are stacked. The SfChart allows you to group the stacking series and render accordingly. This article describes how the stacking series can be grouped together.
Solution
The GroupingLabel property in stacking series is used to achieve this scenario. The same name can be given to the GroupingLabel to make a single group into multiple stacking series. In the following example, four StackingColumnSeries are used to the stacking group and split into two separate groups by setting the GroupingLabel as Group1 and Group2. After setting this property, four series stack together into two columns by Label.
XAML
<!--Here stacking group is done by the GroupingLabel property-> <Syncfusion:StackingColumnSeries ItemsSource="{Binding TemperatureData}" XBindingPath="Year" YBindingPath="Autumn" GroupingLabel="Group1" Label="Autumn" LegendIcon="Circle" > </Syncfusion:StackingColumnSeries> <Syncfusion:StackingColumnSeries ItemsSource="{Binding TemperatureData}" XBindingPath="Year" YBindingPath="Spring" GroupingLabel="Group1" Label="Spring" LegendIcon="Circle" > </Syncfusion:StackingColumnSeries> <Syncfusion:StackingColumnSeries ItemsSource="{Binding TemperatureData}" XBindingPath="Year" YBindingPath="Summer" GroupingLabel="Group2" Label="Summer" LegendIcon="Circle" > </Syncfusion:StackingColumnSeries> <Syncfusion:StackingColumnSeries ItemsSource="{Binding TemperatureData}" XBindingPath="Year" YBindingPath="Winter" GroupingLabel="Group2" Label="Winter" LegendIcon="Circle" > </Syncfusion:StackingColumnSeries>
Output
Following screenshot illustrates grouping of stacking series.
Figure 1: Stacking series grouped together based on their labels