public class StackingLineSeries : StackingSeriesBase, IDatapointSelectionDependent, ITooltipDependent, IDataTemplateDependent, IMarkerDependent, IDrawCustomLegendIcon

Remarks

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

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

Utilize the Fill property to customize the line stroke.

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 StackingLineSeries 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 StackingLineSeries class. To customize the chart data labels 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.

Examples

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

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

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

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

    <chart:StackingLineSeries
        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();

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

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

StackingLineSeries bronzeSeries = new StackingLineSeries();
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

StackingLineSeries()

Declaration

public StackingLineSeries()

Fields

MarkerSettingsProperty

Identifies the MarkerSettings bindable property.

Declaration

public static readonly BindableProperty MarkerSettingsProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The MarkerSettings property allows customization of the series markers.

ShowMarkersProperty

Identifies the ShowMarkers bindable property.

Declaration

public static readonly BindableProperty ShowMarkersProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Remarks

The ShowMarkers property determines whether markers are displayed on the chart points.

Properties

MarkerSettings

Gets or sets the option to customize the series markers.

Declaration

public ChartMarkerSettings MarkerSettings { get; set; }

Property Value

Type	Description
ChartMarkerSettings	It accepts ChartMarkerSettings.

    <chart:SfCartesianChart>

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

         <chart:StackingLineSeries ItemsSource = "{Binding Data}"
                                   XBindingPath = "XValue"
                                   YBindingPath = "YValue"
                                   ShowMarkers = "True">
              <chart:StackingLineSeries.MarkerSettings>
                    <chart:ChartMarkerSettings Fill = "Red" Height = "15" Width = "15" />
              </chart:StackingLineSeries.MarkerSettings>
         </chart:StackingLineSeries>

    </chart:SfCartesianChart>

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

    // Eliminated for simplicity

   ChartMarkerSettings chartMarkerSettings = new ChartMarkerSettings()
   {
       Fill = new SolidColorBrush(Colors.Red),
       Height = 15,
       Width = 15,
   };
    StackingLineSeries series = new StackingLineSeries()
    {
          ItemsSource = viewModel.Data,
          XBindingPath = "XValue",
          YBindingPath = "YValue",
          ShowMarkers = true,
          MarkerSettings = chartMarkerSettings,
    };

    chart.Series.Add(series);

ShowMarkers

Gets or sets the value indicating whether to show markers for the series data point.

Declaration

public bool ShowMarkers { get; set; }

Property Value

Type	Description
System.Boolean	It accepts `bool`> values and its default value is false.

Examples

Xaml
C#

    <chart:SfCartesianChart>

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

         <chart:StackingLineSeries ItemsSource = "{Binding Data}"
                                   XBindingPath = "XValue"
                                   YBindingPath = "YValue"
                                   ShowMarkers = "True"/>

    </chart:SfCartesianChart>

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

    // Eliminated for simplicity

    StackingLineSeries series = new StackingLineSeries()
    {
          ItemsSource = viewModel.Data,
          XBindingPath = "XValue",
          YBindingPath = "YValue",
          ShowMarkers = true,
    };

    chart.Series.Add(series);

Methods

CreateSegment()

Creates and initializes a new chart segment for the chart.

Declaration

protected override ChartSegment CreateSegment()

Returns

Type
ChartSegment

Overrides

ChartSeries.CreateSegment()

DrawMarker(ICanvas, Int32, ShapeType, Rect)

Draws the markers for the stacking line series at each data point location on the chart.

Declaration

protected virtual void DrawMarker(ICanvas canvas, int index, ShapeType type, Rect rect)

Parameters

Type	Name	Description
Microsoft.Maui.Graphics.ICanvas	canvas
System.Int32	index
ShapeType	type
Microsoft.Maui.Graphics.Rect	rect