How to Customize an Individual Legend Item in .NET MAUI Circular Chart?

This article provides a detailed walkthrough on how to customize the legend items in a .NET MAUI Circular Chart using the LegendItemCreated event.

The SfCircularChart provides a LegendItemCreated event, which is triggered when a chart legend item is created. This event is particularly useful for customizing the legend to match your application’s design.

The event argument contains the LegendItem object, which includes the following properties:

• IconType – used to get or set the icon type for the legend icon.
• IconHeight – used to get or set the icon height of the legend icon.
• IconWidth – used to get or set the icon width of the legend icon.
• IconBrush – used to change the color of the legend icon.
• Text – used to get or set the text of the label.
• TextColor – used to get or set the color of the label.
• TextMargin – used to get or set the margin size of labels.
• FontSize – used to get or set the font size for the legend label.
• FontAttribute – used to get or set the font style for the legend label.
• FontFamily – used to get or set the font family for the legend label.
• IsToggled – used to get or set the toggle visibility of the legend.
• DisableBrush – used to get or set the legend icon and text disable color when toggled.
• Index – used to get index position of the legend.
• Item – used to get the data object for the associated segment.

Learn step-by-step instructions and gain insights to customize the legend items for each individual data item.

Step 1: Initialize the SfCircularChart and add the series to it as follows.

XAML

<chart:SfCircularChart>

   <chart:PieSeries ItemsSource="{Binding Data}"
                    XBindingPath="Product"
                    YBindingPath="SalesRate"
                    PaletteBrushes="{Binding CustomBrushes}"/>

</chart:SfCircularChart> 

Step 2: Initialize the ChartLegend in SfCircularChart and setting up the LegendItemCreated event.

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

</chart:SfCircularChart> 

Step 3: Customize the legend item for each data series using the LegendItemCreated event handler method.

private void ChartLegend_LegendItemCreated(object sender, LegendItemEventArgs e)
{
   e.LegendItem.FontSize = 23;
   e.LegendItem.IconHeight = 17;
   e.LegendItem.IconWidth = 17;
   switch (e.LegendItem.Index)
   {
       case 0:
           SetLegendItem(e, ShapeType.Rectangle, FontAttributes.Bold, Colors.Crimson, "Arial");
           break;
       case 1:
           SetLegendItem(e, ShapeType.Triangle, FontAttributes.Italic, Colors.DarkSlateGray, "TimesNewRoman");
           break;
       case 2:
           SetLegendItem(e, ShapeType.Diamond, FontAttributes.Bold, Colors.DarkSeaGreen, "Calibri");
           break;
       case 3:
           SetLegendItem(e, ShapeType.Hexagon, FontAttributes.Italic, Colors.DarkCyan, "Verdana");
           break;
       default:
           SetLegendItem(e, ShapeType.Circle, FontAttributes.None, Colors.YellowGreen, "Georgia");
           break;
   }
}

private void SetLegendItem(LegendItemEventArgs e, ShapeType iconType, FontAttributes fontAttributes, Color textColor, string fontFamily)
{
   e.LegendItem.IconType = iconType;
   e.LegendItem.FontAttributes = fontAttributes;
   e.LegendItem.TextColor = textColor;
   e.LegendItem.FontFamily = fontFamily;
}

Output:

Conclusion:
I hope you enjoyed learning how to customize legend items via the LegendItemCreated event in a .NET MAUI Circular Chart.
You can refer to our .NET MAUI Circular Chart feature tour page to learn about its other groundbreaking feature representations. Explore our documentation to understand how to present and manipulate data.
For current customers, check out our components from the License and Downloads page. If you are new to Syncfusion®, try our 30-day free trial to check out our other controls.
Please let us know in the comments section if you have any queries or require clarification. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!