On UWP the grid and category label text is in white not black like iOS or Android

[John]

Is there a way to set the legend color for the category labels and also the grid displayed behind the chart?

I have set the background to black on UWP to show all the elements are in white, see attached image.

John

Attachment: Screen_Shot_20191022_at_6.51.47_AM.png_8fe09527.zip

[Hemalatha Marikumar]

Hi John, 

  

Greetings from Syncfusion. 

  

Query 1: Is there a way to set the legend color for the category labels. 

 

Yes, you can achieve this requirement by binding the series Color property to TextColor of ChartAxisLabelStyle which is available in ChartAxis as like in below code snippet. 

  

Code Snippet[Xaml]: 

 <chart:CategoryAxis > 

                    <chart:CategoryAxis.LabelStyle> 

                        <chart:ChartAxisLabelStyle TextColor="{Binding Source={x:Reference series},Path=Color }"/> 

                    </chart:CategoryAxis.LabelStyle> 

</chart:CategoryAxis> 

  

<chart:SfChart.Series> 

                <chart:ColumnSeries x:Name="series" Color="#FFFEBE17" Label="ColumnSeries" XBindingPath="XValue" YBindingPath="YValue" ItemsSource="{Binding Data}" /> 

</chart:SfChart.Series> 

  

Query 2: And also the grid displayed behind the chart? I have set the background to black on UWP to show all the elements are in white. 

 

You can achieve this requirement by customizing the MajorGridLineStyle, MajorTickStyle and AxisLineStyle which is available in ChartAxis and ChartLegendLabelStyle in ChartLegend as like in below code snippet. 

  

Code Snippet[Xaml]: 

  

<chart:CategoryAxis > 

                    <chart:CategoryAxis.LabelStyle> 

                        <chart:ChartAxisLabelStyle TextColor="{Binding Source={x:Reference series},Path=Color}"/> 

                    </chart:CategoryAxis.LabelStyle> 

                    <chart:CategoryAxis.MajorGridLineStyle> 

                        <chart:ChartLineStyle StrokeColor="White"/> 

                    </chart:CategoryAxis.MajorGridLineStyle> 

                    <chart:CategoryAxis.MajorTickStyle> 

                        <chart:ChartAxisTickStyle StrokeColor="White"/> 

                    </chart:CategoryAxis.MajorTickStyle> 

                   <chart:CategoryAxis.AxisLineStyle> 

                        <chart:ChartLineStyle StrokeColor="White"/> 

                    </chart:CategoryAxis.AxisLineStyle> 

  </chart:CategoryAxis> 

<chart:ChartLegend> 

                    <chart:ChartLegend.LabelStyle> 

                        <chart:ChartLegendLabelStyle TextColor="White"/> 

                    </chart:ChartLegend.LabelStyle> 

</chart:ChartLegend> 

  

  

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/148490/ze/148490-1486364855.zip 

  

Screenshot: 

 

Please let us know if need any further assistance. 

 

Regards, 

Hemalatha M.