We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Change color of legend text

Thread ID:

Created:

Updated:

Platform:

Replies:

121445 Dec 15,2015 07:10 PM UTC Dec 18,2015 06:10 AM UTC Xamarin.Forms 3
loading
Tags: SfChart
Ian Leatherbury
Asked On December 15, 2015 07:10 PM UTC

How can I change the text color of a legend?

XAML
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="tryfsharpforms.CompareTwoStocksChartPage" 
xmlns:chart="clr-namespace:Syncfusion.SfChart.XForms;assembly=Syncfusion.SfChart.XForms" >
<ContentPage.Content>
<chart:SfChart x:Name="Chart">
<!-- Primary Axis-->
<chart:SfChart.PrimaryAxis>
<chart:CategoryAxis LabelRotationAngle="-45">
<chart:CategoryAxis.Title>
<chart:ChartAxisTitle Text="Date" TextColor="White" />
</chart:CategoryAxis.Title>
</chart:CategoryAxis>
</chart:SfChart.PrimaryAxis>
<!-- Secondary Axis-->
<chart:SfChart.SecondaryAxis>
<chart:NumericalAxis>
<chart:NumericalAxis.Title>
<chart:ChartAxisTitle Text="Price" TextColor="White" />
</chart:NumericalAxis.Title>
</chart:NumericalAxis>
</chart:SfChart.SecondaryAxis>
<!-- Line Graph-->
<chart:SfChart.Series>
<chart:LineSeries StrokeWidth="2" ItemsSource="{Binding StockData1}" XBindingPath="Date" YBindingPath="Close" x:Name="series1" />
<chart:LineSeries StrokeWidth="2" ItemsSource="{Binding StockData2}" XBindingPath="Date" YBindingPath="Close" x:Name="series2"/>
<!--      End Line Graph-->
</chart:SfChart.Series>
<chart:SfChart.Legend>
<chart:ChartLegend ToggleSeriesVisibility="true" />
</chart:SfChart.Legend>
</chart:SfChart>
</ContentPage.Content>
</ContentPage>

C# 
public partial class CompareTwoStocksChartPage : ContentPage
{
public CompareTwoStocksChartPage (IEnumerable<Tuple<DateTime, decimal>> priceList1, IEnumerable<Tuple<DateTime, decimal>> priceList2, string ticker1, string ticker2)
{
InitializeComponent ();

Title = ticker1.ToUpper() + " vs " + ticker2.ToUpper();

BackgroundColor = MyColors.MidnightBlue;
series1.Color = MyColors.Turqoise;
series2.Color = MyColors.Carrot;

series1.Label = ticker1.ToUpper ();

series2.Label = ticker2.ToUpper ();


var svm = new StocksViewModel (priceList1, priceList2);
BindingContext = svm;
}
}

Screenshot. Pardon the size :-)

Manivannan Elangovan [Syncfusion]
Replied On December 16, 2015 12:14 PM UTC

Hi Lan,

Thanks for using Syncfusion products.

We have analyzed your requirement and we are able to achieve your requirement by using LabelStyle. To achieve this, we need to set TextColor of LabelStyle. Please refer the following code example for changing the legend text color.


Code Example:

<chart:SfChart.Legend>

     <chart:ChartLegend ToggleSeriesVisibility="true" >

          <chart:ChartLegend.LabelStyle>

                   <chart:ChartLegendLabelStyle TextColor="Red" />

          </chart:ChartLegend.LabelStyle>

    </chart:ChartLegend>

</chart:SfChart.Legend>


We have prepared a sample based on requirement and please download the sample from the below location.

Sample: LegendTextColor

Regards,
Manivannan.E


Ian Leatherbury
Replied On December 17, 2015 06:28 PM UTC

That was it, thank you!

Manivannan Elangovan [Syncfusion]
Replied On December 18, 2015 06:10 AM UTC

Hi Lan,

Thanks for the update. Please let us know if you have any query.

Regards,
Manivannan.E

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;