Home > Software design >  Changing colour of Syncfusion pie chart in .net maui
Changing colour of Syncfusion pie chart in .net maui

Time:09-01

I am using Syncfusion pie chart in my .net maui project however I am really struggling to change the colours of the segments as I am so new to the platform. Here is my code:

                           <chart:SfCircularChart>

                            <chart:PieSeries ItemsSource="{Binding ProjectData}" XBindingPath="Project" YBindingPath="Amount" EnableTooltip="True" StartAngle="180" EndAngle="360" />
                             
                        </chart:SfCircularChart>

The graph appears like this: pie chart

I have found various Xamarin forms tutorials and examples using C# but surely there is an easier way to change the colours on the frontend?

CodePudding user response:

Color in piechart should be setted as a data like the code below. In frontend it could not define each part's color in the chart.

  public partial class MainPage : ContentPage
    {
        List<Entry> entries = new List<Entry>
        {
            new Entry(200)
            {
                Color=SKColor.Parse("#FF1943"),
                Label ="January",
                ValueLabel = "200"
                
            },
            new Entry(400)
            {
                Color = SKColor.Parse("00BFFF"),
                Label = "March",
                ValueLabel = "400"
                
            },
            new Entry(-100)
            {
                Color =  SKColor.Parse("#00CED1"),
                Label = "Octobar",
                ValueLabel = "-100"
            },
            };
        public MainPage()
        {
            InitializeComponent();


            Chart1.Chart = new PieChart() { Entries = entries };

        }
    }

CodePudding user response:

You need to change your colours in the ViewModel:

        public ISeries[] PieOne { get; set; } = new ISeries[]
        {
        new PieSeries<double> { Values = new List<double> { DegreeStudents }, InnerRadius = 50, Fill = new SolidColorPaint(new SKColor(93, 58, 243)),  Name = "Degree" },
        new PieSeries<double> { Values = new List<double> { DiplomaStudents }, InnerRadius = 50, Fill = new SolidColorPaint(new SKColor(234, 174, 249)),  Name = "Diploma" },
        };

The SKColor attribute should be used to change the colour of the graph, while needing to set FIll = SKColor(), inside SKColor can be hex or rgb.

Your code that you pasted is only for displaying the chart on the View and you cannot set any attributes to change the appearance of the chart on the View.

  • Related