public class StackingColumnSeries : StackingSeriesBase, IDatapointSelectionDependent, ITooltipDependent, IDataTemplateDependent, IDrawCustomLegendIcon, ISBSDependent

Remarks

To render a series, create an instance of StackingColumnSeries class, and add it to the Series collection.

It provides options for Fill, PaletteBrushes, StrokeWidth, Stroke, and Opacity to customize the appearance.

EnableTooltip - A tooltip displays information while tapping or mouse hovering above a segment. To display the tooltip on a chart, you need to set the EnableTooltip property as true in StackingColumnSeries class, and also refer TooltipBehavior property.

Data Label - Data labels are used to display values related to a chart segment. To render the data labels, you need to set the ShowDataLabels property as true in StackingColumnSeries class. To customize the chart data labels alignment, placement, and label styles, you need to create an instance of CartesianDataLabelSettings and set to the DataLabelSettings property.

Animation - To animate the series, set True to the EnableAnimation property.

LegendIcon - To customize the legend icon using the LegendIcon property.

Spacing - To specify the spacing between segments using the Spacing property.

Examples

<chart:SfCartesianChart>
    <chart:SfCartesianChart.XAxes>
        <chart:CategoryAxis/>
    </chart:SfCartesianChart.XAxes>

    <chart:SfCartesianChart.YAxes>
        <chart:NumericalAxis/>
    </chart:SfCartesianChart.YAxes>

    <chart:StackingColumnSeries
        ItemsSource = "{Binding MedalDetails}"
        XBindingPath = "CountryName"
        YBindingPath = "GoldMedals"/>

    <chart:StackingColumnSeries
        ItemsSource = "{Binding MedalDetails}"
        XBindingPath = "CountryName"
        YBindingPath = "SilverMedals"/>

    <chart:StackingColumnSeries
        ItemsSource = "{Binding MedalDetails}"
        XBindingPath = "CountryName"
        YBindingPath = "BronzeMedals"/>
</chart:SfCartesianChart>

SfCartesianChart chart = new SfCartesianChart();

CategoryAxis xAxis = new CategoryAxis();
NumericalAxis yAxis = new NumericalAxis();

chart.XAxes.Add(xAxis);
chart.YAxes.Add(yAxis);

ViewModel viewModel = new ViewModel();

StackingColumnSeries goldSeries = new StackingColumnSeries();
goldSeries.ItemsSource = viewModel.MedalDetails;
goldSeries.XBindingPath = "CountryName";
goldSeries.YBindingPath = "GoldMedals";

StackingColumnSeries silverSeries = new StackingColumnSeries();
silverSeries.ItemsSource = viewModel.MedalDetails;
silverSeries.XBindingPath = "CountryName";
silverSeries.YBindingPath = "SilverMedals";

StackingColumnSeries bronzeSeries = new StackingColumnSeries();
bronzeSeries.ItemsSource = viewModel.MedalDetails;
bronzeSeries.XBindingPath = "CountryName";
bronzeSeries.YBindingPath = "BronzeMedals";

chart.Series.Add(goldSeries);
chart.Series.Add(silverSeries);
chart.Series.Add(bronzeSeries);

this.Content = chart;

    public ObservableCollection<MedalData> MedalDetails { get; set; }

    public ViewModel()
    {
        MedalDetails = new ObservableCollection<MedalData>
        {
            new MedalData() { CountryName = "USA", GoldMedals = 10, SilverMedals = 5, BronzeMedals = 7 },
            new MedalData() { CountryName = "China", GoldMedals = 8, SilverMedals = 10, BronzeMedals = 6 },
            new MedalData() { CountryName = "Russia", GoldMedals = 6, SilverMedals = 4, BronzeMedals = 8 },
            new MedalData() { CountryName = "UK", GoldMedals = 4, SilverMedals = 7, BronzeMedals = 3 }
        };
    }

Constructors

StackingColumnSeries()

Declaration

public StackingColumnSeries()

Fields

CornerRadiusProperty

Identifies the CornerRadius bindable property.

Declaration

public static readonly BindableProperty CornerRadiusProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The CornerRadius property helps to smooth column edges in stacking column series.

SpacingProperty

Identifies the Spacing bindable property.

Declaration

public static readonly BindableProperty SpacingProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The Spacing property indicate spacing between the segments across the series.

WidthProperty

Identifies the Width bindable property.

Declaration

public static readonly BindableProperty WidthProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The Width property indicates the width of the stacking column segment.

Properties

CornerRadius

Gets or sets the value for the corner radius that helps to smooth column edges in stacking column series.

Declaration

public CornerRadius CornerRadius { get; set; }

Property Value

Type	Description
Microsoft.Maui.CornerRadius	It accepts Microsoft.Maui.CornerRadius value, and its default value is null.

    <chart:SfCartesianChart>

    <!-- ... Eliminated for simplicity-->

         <chart:StackingColumnSeries ItemsSource = "{Binding Data}"
                           XBindingPath = "XValue"
                           YBindingPath = "YValue"
                           CornerRadius = "5"/>

    </chart:SfCartesianChart>

    SfCartesianChart chart = new SfCartesianChart();
    ViewModel viewModel = new ViewModel();

    // Eliminated for simplicity

    StackingColumnSeries stackingSeries = new StackingColumnSeries()
    {
          ItemsSource = viewModel.Data,
          XBindingPath = "XValue",
          YBindingPath = "YValue",
          CornerRadius = new CornerRadius(5)
    };

    chart.Series.Add(stackingSeries);

Spacing

Gets or sets a value to indicate spacing between the segments across the series.

Declaration

public double Spacing { get; set; }

Property Value

Type	Description
System.Double	It accepts `double` values ranging from 0 to 1, where the default value is 0.

Examples

Xaml
C#

    <chart:SfCartesianChart>

    <!-- ... Eliminated for simplicity-->

         <chart:StackingColumnSeries ItemsSource = "{Binding Data}"
                                     XBindingPath = "XValue"
                                     YBindingPath = "YValue"
                                     Spacing = "0.3"/>

    </chart:SfCartesianChart>

    SfCartesianChart chart = new SfCartesianChart();
    ViewModel viewModel = new ViewModel();

    // Eliminated for simplicity

    StackingColumnSeries stackingSeries = new StackingColumnSeries()
    {
          ItemsSource = viewModel.Data,
          XBindingPath = "XValue",
          YBindingPath = "YValue",
          Spacing = 0.3,
    };

    chart.Series.Add(stackingSeries);

Width

Gets or sets a value to change the width of the stacking column segment.

Declaration

public double Width { get; set; }

Property Value

Type	Description
System.Double	It accepts `double` values ranging from 0 to 1, where the default value is `0.8`.

Examples

Xaml
C#

    <chart:SfCartesianChart>

    <!-- ... Eliminated for simplicity-->

         <chart:StackingColumnSeries ItemsSource = "{Binding Data}"
                                     XBindingPath = "XValue"
                                     YBindingPath = "YValue"
                                     Width = "0.7"/>

    </chart:SfCartesianChart>

    SfCartesianChart chart = new SfCartesianChart();
    ViewModel viewModel = new ViewModel();

    // Eliminated for simplicity

    StackingColumnSeries stackingSeries = new StackingColumnSeries()
    {
          ItemsSource = viewModel.Data,
          XBindingPath = "XValue",
          YBindingPath = "YValue",
          Width = 0.7,
    };

    chart.Series.Add(stackingSeries);

Methods

CreateSegment()

Creates and initializes a new chart segment for the chart.

Declaration

protected override ChartSegment CreateSegment()

Returns

Type
ChartSegment

Overrides

ChartSeries.CreateSegment()