Pie Chart in .NET MAUI Chart

24 Nov 20222 minutes to read

To render a PieSeries in circular chart, create an instance of the PieSeries and add it to the Series collection property of SfCircularChart.

NOTE

The circular chart has Series as its default content.

XAML

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

C#

SfCircularChart chart = new SfCircularChart();

PieSeries series = new PieSeries();
series.XBindingPath = "Product";
series.YBindingPath = "SalesRate";

chart.Series.Add(series);

Radius

The rendering size of the PieSeries can be controlled using the Radius property as shown in the following code sample.

XAML

<chart:SfCircularChart>
    <chart:PieSeries ItemsSource="{Binding Data}" 
                    XBindingPath="Product" 
                    YBindingPath="SalesRate"
                    Radius = "0.9"/>
    </chart:SfCircularChart.Series>            
</chart:SfCircularChart>

C#

SfCircularChart chart = new SfCircularChart();

PieSeries series = new PieSeries();
series.XBindingPath = "Product";
series.YBindingPath = "SalesRate";
series.Radius = 0.9;

chart.Series.Add(series);

Semi Pie

By using the StartAngle and EndAngle properties, you can draw pie series in different shapes such as semi-pie or quarter pie series.

XAML

<chart:SfCircularChart>
    <chart:PieSeries StartAngle="180"
				EndAngle="360"
				ItemsSource="{Binding Data}"
				XBindingPath="Product"
				YBindingPath="SalesRate" />
</chart:SfCircularChart>

C#

SfCircularChart chart = new SfCircularChart();

PieSeries series = new PieSeries();
series.XBindingPath = "Product";
series.YBindingPath = "SalesRate";
series.StartAngle = 180;
series.EndAngle = 360;

chart.Series.Add(series);