DataMaker show outside SfChart (Pie Series)

[Nguyen Khoa Lu]

When I have many XPath with value 0. The SfChart show DataMaker outside the Frame. And background Datamaker same between of T1 and T11 , T2 and T12. How to fix it?

This my code:
DataMarkerPosition = CircularSeriesDataMarkerPosition.OutsideExtended;

EnableSmartLabels = true;

ShowMarkerAtLineEnd = true;

Did you had solution for this?

Attachment: Error_e4605daa.rar

[Hemalatha Marikumar]

Hi Nguyen Khoa Lu,

Greetings from Syncfusion.

Query 1: The SfChart show DataMarker outside the Frame. 

 

Due to the lack of space in PieSeries, DataMarker goes out of the frame. You can resolve this issue by setting the StartAngle and EndAngle properties in PieSeries.  

 

Please refer below code snippet. 

  

Code Snippet [Xaml]: 

 <chart:SfChart.Series> 

               <chart:PieSeries StartAngle="330" EndAngle="690" ItemsSource="{Binding Data}" XBindingPath="XValue" YBindingPath="YValue" 

                                      EnableSmartLabels="True" ConnectorLineType="Line"  

                                 DataMarkerPosition="OutsideExtended" ShowMarkerAtLineEnd="True"> 

      </chart:PieSeries> 

</chart:SfChart.Series> 

  

Query 2: And background Datamarker same between of T1 and T11 , T2 and T12. 

 

We have provided only ten colors in source level, so the same colors will repeat it when the datapoint is more than ten. You can resolve this issue by setting the CustomBrushes in ChartSeries. 

 

 Please refer below code snippet. 

  

Code Snippet [Xaml]: 

 

<StackLayout.Resources> 

            <ResourceDictionary> 

                <chart:ChartColorCollection x:Key="Colors"> 

                    <Color>Red</Color> 

                    <Color>Gray</Color> 

                    <Color>Blue</Color> 

                    <Color>Pink</Color> 

                    <Color>YellowGreen</Color> 

                    <Color>Aqua</Color> 

                    <Color>Brown</Color> 

                    <Color>DarkGreen</Color> 

                    <Color>Violet</Color> 

                    <Color>Purple</Color> 

                    <Color>Accent</Color> 

                    <Color>Maroon</Color> 

                    <Color>Lavender</Color> 

                    <Color>Navy</Color> 

                </chart:ChartColorCollection> 

            </ResourceDictionary> 

</StackLayout.Resources> 

<chart:SfChart.Series> 

               <chart:PieSeries StartAngle="330" EndAngle="690" ItemsSource="{Binding Data}" XBindingPath="XValue" YBindingPath="YValue" 

                                      EnableSmartLabels="True" ConnectorLineType="Line"  

                                 DataMarkerPosition="OutsideExtended" ShowMarkerAtLineEnd="True"> 

                <chart:PieSeries.ColorModel> 

                        <chart:ChartColorModel Palette="Custom" CustomBrushes="{StaticResource Colors}"/> 

              </chart:PieSeries.ColorModel> 

      </chart:PieSeries> 

</chart:SfChart.Series> 

  

Please refer below link to know more about the CustomBrushes. 

UG Link : https://help.syncfusion.com/xamarin/sfchart/appearance?cs-save-lang=1&cs-lang=xaml#apply-palette-for-series  

  

And we have prepared a sample based on your requirement and you can download the sample from the below link. 

  

Sample : https://www.syncfusion.com/downloads/support/forum/148305/ze/148305158607103.zip  

  

Screenshot: 

 

  

Regards, 

Hemalatha M. 

 

[Nguyen Khoa Lu]

Thanks you. I did it!

[Hemalatha Marikumar]

Hi Nguyen Khoa Lu, 

 

Thanks for your update. We glad to hear that given solution works. 

 

Please let us know if you have any other query. 

 

Regards, 

Hemalatha M.