MAUI

  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class ChartSeries

    Show / Hide Table of Contents

    Class ChartSeries

    ChartSeries is the base class for all chart types.

    Inheritance
    System.Object
    ChartSeries
    CartesianSeries
    CircularSeries
    Namespace: Syncfusion.Maui.Charts
    Assembly: Syncfusion.Maui.Charts.dll
    Syntax
    public abstract class ChartSeries : BindableObject, IDatapointSelectionDependent, ITooltipDependent

    Constructors

    ChartSeries()

    Initializes a new instance of the ChartSeries.

    Declaration
    public ChartSeries()

    Fields

    EnableAnimationProperty

    Identifies the EnableAnimation bindable property.

    Declaration
    public static readonly BindableProperty EnableAnimationProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    EnableTooltipProperty

    Identifies the EnableTooltip bindable property.

    Declaration
    public static readonly BindableProperty EnableTooltipProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    FillProperty

    Identifies the Fill bindable property.

    Declaration
    public static readonly BindableProperty FillProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    IsVisibleOnLegendProperty

    Identifies the IsVisibleOnLegend bindable property.

    Declaration
    public static readonly BindableProperty IsVisibleOnLegendProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    IsVisibleProperty

    Identifies the IsVisible bindable property.

    Declaration
    public static readonly BindableProperty IsVisibleProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    ItemsSourceProperty

    Identifies the ItemsSource bindable property.

    Declaration
    public static readonly BindableProperty ItemsSourceProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    LegendIconProperty

    Identifies the LegendIcon bindable property.

    Declaration
    public static readonly BindableProperty LegendIconProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    OpacityProperty

    Identifies the Opacity bindable property.

    Declaration
    public static readonly BindableProperty OpacityProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    PaletteBrushesProperty

    Identifies the PaletteBrushes bindable property.

    Declaration
    public static readonly BindableProperty PaletteBrushesProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    SelectionBehaviorProperty

    Identifies the SelectionBehavior bindable property.

    Declaration
    public static readonly BindableProperty SelectionBehaviorProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    ShowDataLabelsProperty

    Identifies the ShowDataLabels bindable property.

    Declaration
    public static readonly BindableProperty ShowDataLabelsProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    TooltipTemplateProperty

    Identifies the TooltipTemplate bindable property.

    Declaration
    public static readonly BindableProperty TooltipTemplateProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    XBindingPathProperty

    Identifies the XBindingPath bindable property.

    Declaration
    public static readonly BindableProperty XBindingPathProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    Properties

    EnableAnimation

    Gets or sets a value indicating whether to animate the chart series on loading.

    Declaration
    public bool EnableAnimation { 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:ColumnSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               EnableAnimation = "True"/>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
    
        ColumnSeries columnSeries = new ColumnSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              EnableAnimation = true,
        };
    
        chart.Series.Add(columnSeries);

    EnableTooltip

    Gets or sets a boolean value indicating whether the tooltip for series should be shown or hidden.

    Declaration
    public bool EnableTooltip { get; set; }
    Property Value
    Type Description
    System.Boolean

    It accepts bool values and its default value is False.

    Remarks

    The series tooltip will appear when you click or tap the series area.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:ColumnSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               EnableTooltip="True"/>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
    
        ColumnSeries columnSeries = new ColumnSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              EnableTooltip = true,
        };
    
        chart.Series.Add(columnSeries);

    Fill

    Gets or sets a brush value to customize the series appearance.

    Declaration
    public Brush Fill { get; set; }
    Property Value
    Type Description
    Microsoft.Maui.Controls.Brush

    It accepts a Microsoft.Maui.Controls.Brush value and its default value is null.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:ColumnSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               Fill = "Red"/>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
    
        ColumnSeries columnSeries = new ColumnSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              Fill = new SolidColorBrush(Colors.Red),
        };
    
        chart.Series.Add(columnSeries);

    IsVisible

    Gets or sets a value that indicates whether the series is visible or not.

    Declaration
    public bool IsVisible { get; set; }
    Property Value
    Type Description
    System.Boolean

    It accepts bool values and its default value is True.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:ColumnSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               IsVisible="False"/>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
    
        ColumnSeries columnSeries = new ColumnSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              IsVisible = false,
        };
    
        chart.Series.Add(columnSeries);

    IsVisibleOnLegend

    Gets or sets a value that indicates whether to show a legend item for this series.

    Declaration
    public bool IsVisibleOnLegend { get; set; }
    Property Value
    Type Description
    System.Boolean

    It accepts bool values and its default value is True.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
            <chart:SfCartesianChart.Legend>
               <chart:ChartLegend />
            </chart:SfCartesianChart.Legend>
    
             <chart:ColumnSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               IsVisibleOnLegend = "False"/>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        chart.Legend = new ChartLegend();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
    
        ColumnSeries columnSeries = new ColumnSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              IsVisibleOnLegend = false,
        };
    
        chart.Series.Add(columnSeries);

    ItemsSource

    Gets or sets a data points collection that will be used to plot a chart.

    Declaration
    public object ItemsSource { get; set; }
    Property Value
    Type Description
    System.Object
    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:ColumnSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue" />
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
    
        ColumnSeries columnSeries = new ColumnSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
        };
    
        chart.Series.Add(columnSeries);

    LegendIcon

    Gets or sets a legend icon that will be displayed in the associated legend item.

    Declaration
    public ChartLegendIconType LegendIcon { get; set; }
    Property Value
    Type Description
    ChartLegendIconType

    It accepts ChartLegendIconType values and its default value is Circle.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
            <chart:SfCartesianChart.Legend>
               <chart:ChartLegend />
            </chart:SfCartesianChart.Legend>
    
             <chart:ColumnSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               LegendIcon = "Diamond"/>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        chart.Legend = new ChartLegend();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
    
        ColumnSeries columnSeries = new ColumnSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              LegendIcon = ChartLegendIconType.Diamond,
        };
    
        chart.Series.Add(columnSeries);

    Opacity

    Gets or sets opacity of the chart series.

    Declaration
    public double Opacity { get; set; }
    Property Value
    Type Description
    System.Double

    It accepts double values and the default value is 1. Here, the value ranges from 0 to 1.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:ColumnSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               Opacity="0.5"/>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
    
        ColumnSeries columnSeries = new ColumnSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              Opacity = 0.5,
        };
    
        chart.Series.Add(columnSeries);

    PaletteBrushes

    Gets or sets the list of brushes that can be used to customize the appearance of the series.

    Declaration
    public IList<Brush> PaletteBrushes { get; set; }
    Property Value
    Type Description
    System.Collections.Generic.IList<Microsoft.Maui.Controls.Brush>

    This property accepts a list of brushes as input and comes with a set of predefined brushes by default.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:ColumnSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               PaletteBrushes = "{Binding CustomBrushes}"/>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
        List<Brush> CustomBrushes = new List<Brush>();
        CustomBrushes.Add(new SolidColorBrush(Color.FromRgb(77, 208, 225)));
        CustomBrushes.Add(new SolidColorBrush(Color.FromRgb(38, 198, 218)));
        CustomBrushes.Add(new SolidColorBrush(Color.FromRgb(0, 188, 212)));
        CustomBrushes.Add(new SolidColorBrush(Color.FromRgb(0, 172, 193)));
        CustomBrushes.Add(new SolidColorBrush(Color.FromRgb(0, 151, 167)));
        CustomBrushes.Add(new SolidColorBrush(Color.FromRgb(0, 131, 143)));
    
        // Eliminated for simplicity
    
        ColumnSeries columnSeries = new ColumnSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              PaletteBrushes = CustomBrushes;
        };
    
        chart.Series.Add(columnSeries);

    SelectionBehavior

    Gets or sets a value for initiating selection or highlighting of a single or multiple data points in the series.

    Declaration
    public DataPointSelectionBehavior SelectionBehavior { get; set; }
    Property Value
    Type Description
    DataPointSelectionBehavior

    The default value is null.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.Series>
                <chart:ColumnSeries ItemsSource="{Binding Data}" XBindingPath="XValue" YBindingPath="YValue1">
                    <chart:ColumnSeries.SelectionBehavior>
                        <chart:DataPointSelectionBehavior/>
                    </chart:ColumnSeries.SelectionBehavior>
                </chart:ColumnSeries>
            </chart:SfCartesianChart.Series>
    
    </chart:SfCartesianChart>
     SfCartesianChart chart = new SfCartesianChart();
    
     ViewModel viewModel = new ViewModel();
     chart.BindingContext = viewModel;
    
     DataPointSelectionBehavior behavior = new DataPointSelectionBehavior();
    
     ColumnSeries series = new ColumnSeries()
     {
         ItemsSource = viewmodel.Data,
         XBindingPath = "XValue",
         YBindingPath = "YValue1",
         SelectionBehavior = behavior
     };
    
     chart.Series.Add(series);

    ShowDataLabels

    Gets or sets a value that indicates to enable the data labels for the series..

    Declaration
    public bool ShowDataLabels { get; set; }
    Property Value
    Type Description
    System.Boolean

    It accepts bool values and the default value is False.

    Examples
    • MainWindow.xaml
    • MainWindow.cs
        <chart:SfCartesianChart>
    
              <chart:SfCartesianChart.XAxes>
                  <chart:NumericalAxis/>
              </chart:SfCartesianChart.XAxes>
    
              <chart:SfCartesianChart.YAxes>
                  <chart:NumericalAxis/>
              </chart:SfCartesianChart.YAxes>
    
              <chart:SfCartesianChart.Series>
                  <chart:ColumnSeries ItemsSource="{Binding Data}"
                                      XBindingPath="XValue"
                                      YBindingPath="YValue"
                                      ShowDataLabels="True">
                  </chart:ColumnSeries> 
              </chart:SfCartesianChart.Series>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
    
        NumericalAxis xAxis = new NumericalAxis();
        NumericalAxis yAxis = new NumericalAxis();
    
        chart.XAxes.Add(xAxis);
        chart.YAxes.Add(yAxis);
    
        ColumnSeries series = new ColumnSeries();
        series.ItemsSource = viewmodel.Data;
        series.XBindingPath = "XValue";
        series.YBindingPath = "YValue";
        series.ShowDataLabels = "True";
        chart.Series.Add(series);

    TooltipTemplate

    Gets or sets the DataTemplate that can be used to customize the appearance of the tooltip.

    Declaration
    public DataTemplate TooltipTemplate { get; set; }
    Property Value
    Type Description
    Microsoft.Maui.Controls.DataTemplate

    It accepts a Microsoft.Maui.Controls.DataTemplate value.

    Examples
    • MainWindow.xaml
        <chart:SfCartesianChart>
    
              <chart:SfCartesianChart.Resources>
                  <DataTemplate x:Key="tooltipTemplate1">
                     <StackLayout Orientation = "Horizontal" >
                        <Label Text="{Binding Item.XValue}" 
                               TextColor="Black"
                               FontAttributes="Bold"
                               FontSize="12"
                               HorizontalOptions="Center"
                               VerticalOptions="Center"/>
                        <Label Text = " : "
                               TextColor="Black"
                               FontAttributes="Bold"
                               FontSize="12"
                               HorizontalOptions="Center"
                               VerticalOptions="Center"/>
                        <Label Text = "{Binding Item.YValue}"
                               TextColor="Black"
                               FontAttributes="Bold"
                               FontSize="12"
                               HorizontalOptions="Center"
                               VerticalOptions="Center"/>
                     </StackLayout>
                  </DataTemplate>
              </chart:SfCartesianChart.Resources>
    
              <chart:SfCartesianChart.XAxes>
                  <chart:NumericalAxis/>
              </chart:SfCartesianChart.XAxes>
    
              <chart:SfCartesianChart.YAxes>
                  <chart:NumericalAxis/>
              </chart:SfCartesianChart.YAxes>
    
              <chart:SfCartesianChart.Series>
                  <chart:ColumnSeries ItemsSource="{Binding Data}"
                                      XBindingPath="XValue"
                                      YBindingPath="YValue"
                                      EnableTooltip="True"
                                      TooltipTemplate="{StaticResource tooltipTemplate1}">
                  </chart:ColumnSeries> 
              </chart:SfCartesianChart.Series>
    
        </chart:SfCartesianChart>

    XBindingPath

    Gets or sets a path value on the source object to serve a x value to the series.

    Declaration
    public string XBindingPath { get; set; }
    Property Value
    Type Description
    System.String

    The string that represents the property name for the x plotting data, and its default value is null.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:ColumnSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue" />
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
    
        ColumnSeries columnSeries = new ColumnSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
        };
    
        chart.Series.Add(columnSeries);

    XRange

    Gets the XRange values.

    Declaration
    public DoubleRange XRange { get; }
    Property Value
    Type Description
    DoubleRange

    YRange

    Gets the YRange values.

    Declaration
    public DoubleRange YRange { get; }
    Property Value
    Type Description
    DoubleRange

    Methods

    CreateAnimation(Action<Double>)

    Declaration
    protected virtual Animation CreateAnimation(Action<double> callback)
    Parameters
    Type Name Description
    System.Action<System.Double> callback
    Returns
    Type Description
    Microsoft.Maui.Controls.Animation

    CreateSegment()

    Declaration
    protected abstract ChartSegment CreateSegment()
    Returns
    Type Description
    ChartSegment

    DrawDataLabel(ICanvas, Brush, String, PointF, Int32)

    Declaration
    protected virtual void DrawDataLabel(ICanvas canvas, Brush fillcolor, string label, PointF point, int index)
    Parameters
    Type Name Description
    Microsoft.Maui.Graphics.ICanvas canvas
    Microsoft.Maui.Controls.Brush fillcolor
    System.String label
    Microsoft.Maui.Graphics.PointF point
    System.Int32 index

    DrawSeries(ICanvas, ReadOnlyObservableCollection<ChartSegment>, RectF)

    Declaration
    protected virtual void DrawSeries(ICanvas canvas, ReadOnlyObservableCollection<ChartSegment> segments, RectF clipRect)
    Parameters
    Type Name Description
    Microsoft.Maui.Graphics.ICanvas canvas
    System.Collections.ObjectModel.ReadOnlyObservableCollection<ChartSegment> segments
    Microsoft.Maui.Graphics.RectF clipRect

    GetDataPointIndex(Single, Single)

    Methods to get the index of data point.

    Declaration
    public virtual int GetDataPointIndex(float pointX, float pointY)
    Parameters
    Type Name Description
    System.Single pointX
    System.Single pointY
    Returns
    Type Description
    System.Int32

    OnBindingContextChanged()

    Declaration
    protected override void OnBindingContextChanged()
    Back to top Generated by DocFX
    Copyright © 2001 - 2023 Syncfusion Inc. All Rights Reserved