Class ChartLegend

Represents the legend for the SfCartesianChart, SfCircularChart, SfFunnelChart and SfPyramidChart classes.

Inheritance

System.Object

ChartLegend

Namespace: Syncfusion.Maui.Charts

Assembly: Syncfusion.Maui.Charts.dll

Syntax

public class ChartLegend : Element, IChartLegend, ILegend

Remarks

The items in the legend contain the key information about the ChartSeries. The legend has all abilities such as docking, enabling, or disabling the desired series.

    <chart:SfCartesianChart>

          <chart:SfCartesianChart.Legend>
              <chart:ChartLegend/>
          </chart:SfCartesianChart.Legend>

    </chart:SfCartesianChart>

    SfCartesianChart chart = new SfCartesianChart();
    chart.Legend = new ChartLegend();

Constructors

ChartLegend()

Declaration

public ChartLegend()

Fields

IsVisibleProperty

Identifies the IsVisible bindable property.

Declaration

public static readonly BindableProperty IsVisibleProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

ItemsLayoutProperty

Identifies the ItemsLayout bindable property.

Declaration

public static readonly BindableProperty ItemsLayoutProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

ItemTemplateProperty

Identifies the ItemTemplate bindable property.

Declaration

public static readonly BindableProperty ItemTemplateProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

LabelStyleProperty

Declaration

public static readonly BindableProperty LabelStyleProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

PlacementProperty

Identifies the Placement bindable property.

Declaration

public static readonly BindableProperty PlacementProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

ToggleSeriesVisibilityProperty

Identifies the ToggleSeriesVisibility bindable property.

Declaration

public static readonly BindableProperty ToggleSeriesVisibilityProperty

Field Value

Type
Microsoft.Maui.Controls.BindableProperty

Properties

IsVisible

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

Declaration

public bool IsVisible { get; set; }

Property Value

Type	Description
System.Boolean	It accepts bool values and the default value is `True`

Examples

MainPage.xaml
MainPage.xaml.cs

<chart:SfCircularChart>

    <chart:SfCircularChart.Legend>
       <chart:ChartLegend IsVisible = "True"/>
    </chart:SfCircularChart.Legend>

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

</chart:SfCircularChart>

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

chart.Legend = new ChartLegend(){ IsVisible = true };

PieSeries series = new PieSeries()
{
   ItemsSource = viewModel.Data,
   XBindingPath = "XValue",
   YBindingPath = "YValue",
};
chart.Series.Add(series);

ItemsLayout

Gets or sets the layout configuration for the items in the chart legend. This property allows you to define how individual legend items are arranged within the legend.

Declaration

public Layout ItemsLayout { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.Layout	It accepts the Microsoft.Maui.Controls.Layoutvalue and its default value is null.

Examples

<chart:SfCircularChart x:Name="chart">
    <chart:SfCircularChart.BindingContext>
           <model:ViewModel/>
    </chart:SfCircularChart.BindingContext>

    <chart:SfCircularChart.Legend>
        <model:LegendExt Placement = "Bottom">
            <chart:ChartLegend.ItemsLayout>
                <FlexLayout WidthRequest = "400" Background="Pink" Wrap="Wrap"/>
            </chart:ChartLegend.ItemsLayout>
        </model:LegendExt>
    </chart:SfCircularChart.Legend>

    <chart:PieSeries ItemsSource="{Binding Data}"
                     XBindingPath="XValue"
                     YBindingPath="YValue"/>
</chart:SfCircularChart>

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

 LegendExt legend = new LegendExt();
 legend.Placement = LegendPlacement.Bottom;

 legend.ItemsLayout = new FlexLayout()
 {
   Wrap = Microsoft.Maui.Layouts.FlexWrap.Wrap,
   WidthRequest = 400
 };

 chart.Legend = legend;

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

chart.Series.Add(series);

    public class LegendExt : ChartLegend
    {
        protected override double GetMaximumSizeCoefficient()
        {
            return 0.5;
        }
    }

ItemTemplate

Gets or sets a template to customize the appearance of each legend item.

Declaration

public DataTemplate ItemTemplate { get; set; }

Property Value

Type	Description
Microsoft.Maui.Controls.DataTemplate	It accepts Microsoft.Maui.Controls.DataTemplate value.

Examples

MainPage.xaml

<chart:SfCircularChart>

    <chart:SfCircularChart.Legend>
       <chart:ChartLegend>
           <chart:ChartLegend.ItemTemplate>
               <DataTemplate>
                   <StackLayout Orientation="Horizontal" >
                       <Rectangle HeightRequest="12" WidthRequest="12" Margin="3"
                                  Background="{Binding IconBrush}"/>
                       <Label Text="{Binding Text}" Margin="3"/>
                   </StackLayout>
               </DataTemplate>
           </chart:ChartLegend.ItemTemplate>
       </chart:ChartLegend>
    </chart:SfCircularChart.Legend>

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

</chart:SfCircularChart>

LabelStyle

Gets or sets the value to customize the appearance of chart legend labels.

Declaration

public ChartLegendLabelStyle LabelStyle { get; set; }

Property Value

Type	Description
ChartLegendLabelStyle	It accepts the ChartLegendLabelStyle value.

Remarks

To customize the legend labels appearance, Create an instance of the ChartLegendLabelStyle class and set to the LabelStyle property.

Examples

MainPage.xaml
MainPage.xaml.cs

<chart:SfCircularChart>

    <chart:SfCircularChart.Legend>
        <chart:ChartLegend>
           <chart:ChartLegend.LabelStyle>
               <chart:ChartLegendLabelStyle TextColor = "Red" FontSize="25"/>
           </chart:ChartLegend.LabelStyle>
       </chart:ChartLegend>
    </chart:SfCircularChart.Legend>

    <chart:PieSeries ItemsSource="{Binding Data}"
                     XBindingPath="XValue"
                     YBindingPath="YValue"/>
</chart:SfCircularChart>

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

chart.Legend = new ChartLegend(); 
ChartLegendLabelStyle labelStyle = new ChartLegendLabelStyle()
{
     TextColor = Colors.Red,
     FontSize = 25,
};

PieSeries series = new PieSeries()
{
   ItemsSource = viewModel.Data,
   XBindingPath = "XValue",
   YBindingPath = "YValue",
};
chart.Legend=labelStyle;
chart.Series.Add(series);

Placement

Gets or sets the placement for the legend in a chart.

Declaration

public LegendPlacement Placement { get; set; }

Property Value

Type	Description
LegendPlacement	It accepts LegendPlacement values and the default value is Top.

Remarks

Legends can be placed left, right, top, or bottom around the chart area.

Examples

MainPage.xaml
MainPage.xaml.cs

<chart:SfCircularChart>

    <chart:SfCircularChart.Legend>
       <chart:ChartLegend Placement = "Right"/>
    </chart:SfCircularChart.Legend>

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

</chart:SfCircularChart>

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

chart.Legend = new ChartLegend(){ Placement = LegendPlacement.Right };

PieSeries series = new PieSeries()
{
   ItemsSource = viewModel.Data,
   XBindingPath = "XValue",
   YBindingPath = "YValue",
};
chart.Series.Add(series);

ToggleSeriesVisibility

Gets or sets a value indicating whether the chart series visibility by tapping the legend item.

Declaration

public bool ToggleSeriesVisibility { get; set; }

Property Value

Type	Description
System.Boolean	It accepts bool values and the default value is `False`

Examples

MainPage.xaml
MainPage.xaml.cs

<chart:SfCircularChart>

    <chart:SfCircularChart.Legend>
       <chart:ChartLegend ToggleSeriesVisibility = "True"/>
    </chart:SfCircularChart.Legend>

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

</chart:SfCircularChart>

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

chart.Legend = new ChartLegend(){ ToggleSeriesVisibility = true };

PieSeries series = new PieSeries()
{
   ItemsSource = viewModel.Data,
   XBindingPath = "XValue",
   YBindingPath = "YValue",
};
chart.Series.Add(series);

Methods

GetMaximumSizeCoefficient()

Used to specify the maximum size coefficient for the chart legend.

Declaration

protected virtual double GetMaximumSizeCoefficient()

Returns

Type	Description
System.Double	It accepts the `double` values and its default value is 0.25.

Remarks

The value must be between 0 and 1.

OnBindingContextChanged()

Declaration

protected override void OnBindingContextChanged()

OnParentChanged()

Declaration

protected override void OnParentChanged()

Events

LegendItemCreated

This event occurs when the legend label is created.

Declaration

public event EventHandler<LegendItemEventArgs> LegendItemCreated

Event Type

Type
System.EventHandler<LegendItemEventArgs>

Remarks

The LegendItemEventArgs contains the information of LegendItem.

Examples

MainPage.xaml
MainPage.xaml.cs

<chart:SfCircularChart>

    <chart:SfCircularChart.Legend>
        <chart:ChartLegend LegendItemCreated="OnLegendLabelCreated" />
    </chart:SfCircularChart.Legend>

</chart:SfCircularChart>

SfCircularChart chart = new SfCircularChart();

ChartLegend legend = new ChartLegend();
legend.LegendItemCreated += OnLegendLabelCreated;
chart.Legend=legend;

private void OnLegendLabelCreated(object sender, LegendItemEventArgs e)
{
     // You can customize the legend item.
}