Articles in this section
Category / Section

Show the "Others” Category Values in WinUI Pie Chart Data Label.

6 mins read

This article explains how to show the data label of a circular pie chart in WinUI to the “Others” category values using the WinUI CircularChart.

The ContentTemplate property can be used to customize the data label of the pie chart using the Context property with an IValueConverter. To show the data label in the “Others” category, use the GroupTo and GroupMode properties in the CircularSeries. The following code example demonstrates how to show the data label of the pie chart to the “Others” category in the SfCircularChart.

[Xaml]

<Grid>
…
        <Grid.Resources>
            <local:DataLabelXValueConverter x:Key="dataLabelXValue"/>
            <local:DataLabelYValueConverter x:Key="dataLabelYValue" />
            <DataTemplate x:Key="dataLabelTemplate">
                <StackPanel BorderBrush="Black" BorderThickness="1" 
                                        CornerRadius="2"   Orientation="Horizontal">
                    <TextBlock Foreground="Black" FontWeight="Bold" 
                               Text="{Binding Converter={StaticResource dataLabelXValue}}" />
                    <TextBlock Text=":  " Foreground="Black" FontWeight="Bold"/>
                    <TextBlock Foreground="Black" FontWeight="Bold" 
                               Text="{Binding Converter={StaticResource dataLabelYValue}}"  />
                </StackPanel>
            </DataTemplate>
        </Grid.Resources>
      <chart:SfCircularChart >
            <chart:PieSeries XBindingPath="Product"  ShowDataLabels="True" Radius="0.7"
                             GroupTo="10" GroupMode="Percentage" YBindingPath="SalesPercentage"
                             ItemsSource="{Binding Data}" >
                <chart:PieSeries.DataLabelSettings>   
                    <chart:CircularDataLabelSettings ShowConnectorLine="True"       Context="DataLabelItem"  Position="OutsideExtended"    UseSeriesPalette="True" 
                         ContentTemplate="{StaticResource dataLabelTemplate}" />
                </chart:PieSeries.DataLabelSettings>
            </chart:PieSeries>
      </chart:SfCircularChart>
    </Grid>

[C#]

public class DataLabelXValueConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, string language)
        {
            ChartDataLabel pieAdornment = value as ChartDataLabel;
            if(pieAdornment.Item is List<object>)
            {
                return "Others";
            }
            else if ((pieAdornment.Item as Model).Product != null)
            {

                return string.Format((pieAdornment.Item as Model).Product.ToString());

            }
            else
                return null;
        }

        public object ConvertBack(object value, Type targetType, object parameter, string language)
        {
            return value;
        }
    }

    public class DataLabelYValueConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, string language)
        {
            ChartDataLabel pieAdornment = value as ChartDataLabel;
            if (pieAdornment.Item is List<object>)
            {
                var data = pieAdornment.Item as List<object>;
                var yValue = data.Sum(item => (item as Model).SalesPercentage);
                return yValue.ToString("P0");
            }
            else if (!double.IsNaN((pieAdornment.Item as Model).SalesPercentage))
            {

                return (pieAdornment.Item as Model).SalesPercentage.ToString("P0");

            }
            else
                return null;
        }

        public object ConvertBack(object value, Type targetType, object parameter, string language)
        {
            return value;
        }
    }

Output

PieChart.png

Download the sample in GitHub.

Conclusion
I hope you enjoyed learning about how to show the "Others” Category Values in WinUI Pie Chart Data Label.

You can refer to our WinUI Cartesian Chart feature tour page to know about its other groundbreaking feature representations. You can also explore our WinUI Cartesian Chart documentation to understand how to present and manipulate data.

For current customers, you can check out our WinUI Controls from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our WinUI Cartesian Chart and other .WinUI controls.

If you have any queries or require clarifications, please let us know in comments below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments
Please  to leave a comment
Access denied
Access denied