menu

WinUI

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class ChartDataLabelSettings - WinUI API Reference | Syncfusion

    Show / Hide Table of Contents

    Class ChartDataLabelSettings

    It's a base class for the CartesianDataLabelSettings, CircularDataLabelSettings, PolarDataLabelSettings, FunnelDataLabelSettings, and PyramidDataLabelSettings classes.

    Inheritance
    System.Object
    ChartDataLabelSettings
    CartesianDataLabelSettings
    CircularDataLabelSettings
    FunnelDataLabelSettings
    PolarDataLabelSettings
    PyramidDataLabelSettings
    Namespace: Syncfusion.UI.Xaml.Charts
    Assembly: Syncfusion.Chart.WinUI.dll
    Syntax
    public abstract class ChartDataLabelSettings : DependencyObject
    Remarks

    Data labels can be added to a chart series by enabling the option.

    ChartDataLabelSettings is used to customize the appearance of the data label that appears on a series.

    Constructors

    ChartDataLabelSettings()

    Initializes a new instance of the ChartDataLabelSettings class.

    Declaration
    public ChartDataLabelSettings()

    Fields

    BackgroundProperty

    Identifies the Background dependency property.

    Declaration
    public static readonly DependencyProperty BackgroundProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for Background dependency property.

    BorderBrushProperty

    Identifies the BorderBrush dependency property.

    Declaration
    public static readonly DependencyProperty BorderBrushProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for BorderBrush dependency property.

    BorderThicknessProperty

    Identifies the BorderThickness dependency property.

    Declaration
    public static readonly DependencyProperty BorderThicknessProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for BorderThickness dependency property.

    ConnectorHeightProperty

    Identifies the ConnectorHeight dependency property.

    Declaration
    public static readonly DependencyProperty ConnectorHeightProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for ConnectorHeight dependency property.

    ConnectorLineStyleProperty

    Identifies the ConnectorLineStyle dependency property.

    Declaration
    public static readonly DependencyProperty ConnectorLineStyleProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for ConnectorLineStyle dependency property.

    ConnectorRotationProperty

    Identifies the ConnectorRotation dependency property.

    Declaration
    public static readonly DependencyProperty ConnectorRotationProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for ConnectorRotation dependency property.

    ContentTemplateProperty

    Identifies the ContentTemplate dependency property.

    Declaration
    public static readonly DependencyProperty ContentTemplateProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for ContentTemplate dependency property.

    ContextProperty

    Identifies the Context dependency property.

    Declaration
    public static readonly DependencyProperty ContextProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for Context dependency property.

    FontFamilyProperty

    Identifies the FontFamily dependency property.

    Declaration
    public static readonly DependencyProperty FontFamilyProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for FontFamily dependency property.

    FontSizeProperty

    Identifies the FontSize dependency property.

    Declaration
    public static readonly DependencyProperty FontSizeProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for FontSize dependency property.

    FontStyleProperty

    Identifies the FontStyle dependency property.

    Declaration
    public static readonly DependencyProperty FontStyleProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for FontStyle dependency property.

    ForegroundProperty

    Identifies the Foreground dependency property.

    Declaration
    public static readonly DependencyProperty ForegroundProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for Foreground dependency property.

    FormatProperty

    Identifies the Format dependency property.

    Declaration
    public static readonly DependencyProperty FormatProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for Format dependency property.

    HighlightOnSelectionProperty

    Identifies the HighlightOnSelection dependency property.

    Declaration
    public static readonly DependencyProperty HighlightOnSelectionProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for HighlightOnSelection dependency property.

    HorizontalAlignmentProperty

    Identifies the HorizontalAlignment dependency property.

    Declaration
    public static readonly DependencyProperty HorizontalAlignmentProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for HorizontalAlignment dependency property.

    MarginProperty

    Identifies the Margin dependency property.

    Declaration
    public static readonly DependencyProperty MarginProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for Margin dependency property.

    RotationProperty

    Identifies the Rotation dependency property.

    Declaration
    public static readonly DependencyProperty RotationProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for Rotation dependency property.

    UseSeriesPaletteProperty

    Identifies the UseSeriesPalette dependency property.

    Declaration
    public static readonly DependencyProperty UseSeriesPaletteProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for UseSeriesPalette dependency property.

    VerticalAlignmentProperty

    Identifies the VerticalAlignment dependency property.

    Declaration
    public static readonly DependencyProperty VerticalAlignmentProperty
    Field Value
    Type Description
    Microsoft.UI.Xaml.DependencyProperty

    The identifier for VerticalAlignment dependency property.

    Properties

    Background

    Gets or sets a brush to change the appearance of the data label.

    Declaration
    public Brush Background { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Media.Brush

    It takes the Microsoft.UI.Xaml.Media.Brush value.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings Background = "Red" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings(){Background = new SolidColorBrush(Colors.Red)};
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    BorderBrush

    Gets or sets a brush to customize the appearance of the outer border stroke.

    Declaration
    public Brush BorderBrush { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Media.Brush

    It accepts the Microsoft.UI.Xaml.Media.Brush value.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings BorderThickness="2"
                                                         BorderBrush="Red" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            BorderThickness = new Thickness(2),
            BorderBrush = new SolidColorBrush(Colors.Red),
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    BorderThickness

    Gets or sets a thickness value to adjust the label's border thickness.

    Declaration
    public Thickness BorderThickness { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Thickness

    It accepts the Microsoft.UI.Xaml.Thickness value and its default value is 0.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings BorderThickness="2"
                                                         BorderBrush="Red" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            BorderThickness = new Thickness(2),
            BorderBrush = new SolidColorBrush(Colors.Red),
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    ConnectorHeight

    Gets or sets a value to change the data label's connector line height.

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

    It accepts the double value and its default value is 0.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings ConnectorHeight="50" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            ConnectorHeight = 50,
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    ConnectorLineStyle

    Gets or sets a style to customize the connector line's appearance.

    Declaration
    public Style ConnectorLineStyle { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Style

    It accepts the Microsoft.UI.Xaml.Style value.

    Remarks

    To display the connector line, use the ShowDataLabels, ShowConnectorLine, and ConnectorHeight properties.

    Examples
    • MainPage.xaml
    <chart:SfCartesianChart>
         <!-- ... Eliminated for simplicity-->
    
         <chart:LineSeries ItemsSource="{Binding Data}"
                           XBindingPath="XValue"
                           YBindingPath="YValue" 
                           ShowDataLabels="True">
             <chart:LineSeries.DataLabelSettings>
                  <chart:CartesianDataLabelSettings ConnectorHeight = "40" ShowConnectorLine="True">
                       <chart:CartesianDataLabelSettings.ConnectorLineStyle>
                             <Style TargetType = "Path" >
                                 <Setter Property="StrokeDashArray" Value="5,3"/>
                             </Style>
                       </chart:CartesianDataLabelSettings.ConnectorLineStyle>
                  </chart:CartesianDataLabelSettings>
             </chart:LineSeries.DataLabelSettings>
         </chart:LineSeries>
    </chart:SfCartesianChart>

    ConnectorRotation

    Gets or sets a value to rotate the connector line.

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

    It accepts the double value and its default value is double.NaN.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings ShowConnectorLine="True"
                                                         ConnectorHeight="50"
                                                         ConnectorRotation="50" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            ShowConnectorLine= true,
            ConnectorHeight= 50,
            ConnectorRotation = 50,
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    ContentTemplate

    Gets or sets a DataTemplate to customize the appearance of the data label.

    Declaration
    public DataTemplate ContentTemplate { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.DataTemplate

    It accepts the Microsoft.UI.Xaml.DataTemplate value.

    Examples
    • MainPage.xaml
    <chart:SfCartesianChart>
         <!-- ... Eliminated for simplicity-->
    
         <chart:LineSeries ItemsSource="{Binding Data}"
                           XBindingPath="XValue"
                           YBindingPath="YValue" 
                           ShowDataLabels="True">
             <chart:LineSeries.DataLabelSettings>
                  <chart:CartesianDataLabelSettings>
                       <chart:CartesianDataLabelSettings.ContentTemplate>
                           <DataTemplate>
                               <StackPanel Margin = "10" Orientation="Vertical">
                                   <Ellipse Height = "15" Width="15" Fill="Cyan"
                                            Stroke="#4a4a4a" StrokeThickness="2"/>
                                   <TextBlock HorizontalAlignment = "Center" FontSize="12"
                                              Foreground="Black" FontWeight="SemiBold"
                                              Text="{Binding}"/>
                               </StackPanel>
                           </DataTemplate>
                       </chart:CartesianDataLabelSettings.ContentTemplate>
                  </chart:CartesianDataLabelSettings>
             </chart:LineSeries.DataLabelSettings>
         </chart:LineSeries>
    </chart:SfCartesianChart>

    Context

    Gets or sets the LabelContext value to customize the content of data labels.

    Declaration
    public LabelContext Context { get; set; }
    Property Value
    Type Description
    LabelContext

    It accepts the LabelContext value and its default value is YValue.

    Remarks

    This property is used to define the value that will be displayed in the data label, such as the x value or any other value from the underlying model object.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings Context="Percentage"/>
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            Context =LabelContext.Percentage
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    FontFamily

    Gets or sets the font family for data label.

    Declaration
    public FontFamily FontFamily { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Media.FontFamily

    It takes the Microsoft.UI.Xaml.Media.FontFamily value.

    Remarks

    Identifies the font family that should be used to display the DataLabelSettings's text.

    FontSize

    Gets or sets a value to change the label's text size.

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

    It accepts the double value.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings FontSize="20" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            FontSize = 20
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    FontStyle

    Gets or sets the font style for the label.

    Declaration
    public FontStyle FontStyle { get; set; }
    Property Value
    Type Description
    Windows.UI.Text.FontStyle

    It accepts the Windows.UI.Text.FontStyle value.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings FontStyle="Italic" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            FontStyle = FontStyle.Italic
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    Foreground

    Gets or sets a brush to change the appearance of the label.

    Declaration
    public Brush Foreground { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Media.Brush

    It takes the Microsoft.UI.Xaml.Media.Brush value.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings Foreground="Red" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            Foreground = new SolidColorBrush(Colors.Red),
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    Format

    Gets or sets the string formatting that can be used to format the data labels.

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

    It accepts the string value and its default value is string.Empty.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings Format="#.000"/>
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
             Format = "#.000",
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    HighlightOnSelection

    Gets or sets a value indicating whether to enable the datalabel's selection.

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

    If it is true, we can select the data point by selecting datalabels, and its default value is true.

    Remarks

    This feature will be useful for the continuous series like FastLine, Area, etc.

    HorizontalAlignment

    Gets or sets the horizontal alignment for the label.

    Declaration
    public HorizontalAlignment HorizontalAlignment { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.HorizontalAlignment

    It accepts the Microsoft.UI.Xaml.HorizontalAlignment value.

    Margin

    Gets or sets a thickness value to adjust the label's margin.

    Declaration
    public Thickness Margin { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Thickness

    It accepts the Microsoft.UI.Xaml.Thickness value and its default value is 5.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings Margin="5" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            Margin = new Thickness(5),
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    Rotation

    Gets or sets a value that can be used to rotate the data label.

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

    It accepts double values and the default value is 0.

    Remarks

    The label will be rotated with the center as the origin.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings Rotation = "90" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings(){Rotation = 90};
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    Series

    Gets the associated series of this data label.

    Declaration
    public ChartSeries Series { get; }
    Property Value
    Type
    ChartSeries

    ShowConnectorLine

    Gets or sets a value indicating whether the connector line should be shown or hidden.

    Declaration
    public bool ShowConnectorLine { 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:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings ShowConnectorLine="True"
                                                         ConnectorHeight="50" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            ShowConnectorLine= true,
            ConnectorHeight= 50,
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    UseSeriesPalette

    Gets or sets a value indicating whether the background of the data label should be filled with the series color or not.

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

    It accepts the bool value and its default value is True.

    Examples
    • Xaml
    • C#
        <chart:SfCartesianChart>
    
        <!-- ... Eliminated for simplicity-->
    
             <chart:LineSeries ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"
                               ShowDataLabels="True">
                   <chart:LineSeries.DataLabelSettings>
                       <chart:CartesianDataLabelSettings UseSeriesPalette="False" />
                   </chart:LineSeries.DataLabelSettings>
                 </chart:LineSeries>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
        ViewModel viewModel = new ViewModel();
    
        // Eliminated for simplicity
        var dataLabelSettings = new CartesianDataLabelSettings()
        {
            UseSeriesPalette = false,
        };
        LineSeries series = new LineSeries()
        {
              ItemsSource = viewModel.Data,
              XBindingPath = "XValue",
              YBindingPath = "YValue",
              ShowDataLabels = true,
              DataLabelSettings = dataLabelSettings,
        };
    
        chart.Series.Add(series);

    VerticalAlignment

    Gets or sets the vertical alignment for the label.

    Declaration
    public VerticalAlignment VerticalAlignment { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.VerticalAlignment

    It accepts the Microsoft.UI.Xaml.VerticalAlignment value.

    Back to top Generated by DocFX
    Copyright © 2001 - 2025 Syncfusion Inc. All Rights Reserved