Donut Chart with Custom Format / Label Point

[Enrique]

Hi,

Im creating a Dashboard using StoryBoard and Telerik Chart within Xamarin. I was able to create my chart and populate but I'm lost when I try to set the format. I want to set the current Label + Value as the second image. 

 Here is my code and I have attached 2 images, the first one is the current behavior of my code, and second is what I'm trying to create.

TKChart revenueView = new TKChart();

revenueView.BackgroundColor = UIColor.FromRGB (238, 238, 238);
revenueView.AllowAnimations = true;
revenueView.Legend.Hidden = false;
revenueView.Legend.Style.Position = TKChartLegendPosition.Right;
revenueView.AutoresizingMask = ~UIViewAutoresizing.None;


TKChartDonutSeries series = new TKChartDonutSeries (revData.GetCurrentData (time, comparision));

series.Title = "Series Title";

series.SelectionMode = TKChartSeriesSelectionMode.DataPoint;

series.InnerRadius = 0.6f;

series.ExpandRadius = 1.1f;

series.LabelDisplayMode = TKChartPieSeriesLabelDisplayMode.Outside;

series.Style.PointLabelStyle.TextHidden = false;

series.Style.PointLabelStyle.LabelOffset = new UIOffset (0, -25);

revenueView.AddSeries (series);

 

[Adrian]

Hi, Enrique,

Thank you for writing.

This scenario can be achieved by implementing TextForLabelAtPoint method of TKChartDelegate. This delegate method allows you to return a string for every point label in the chart. Consider the code below:

class ChartDelegate : TKChartDelegate
{
    public override string TextForLabelAtPoint (TKChart chart, TKChartData dataPoint, TKChartSeries series, nuint dataIndex)
    {
        // return desired string
    }
}

I hope this helps.

Regards,
Adrian
Telerik

[Enrique]

Is possible apply a Style for an item in the serie just when it is Selected?. I want to show the value as normal behavior display mode outsite, but show the percentage when is selected and display mode inside. In the override method LabelForDataPoint I'm able to detect when is selected but when I apply the style is applied for entire serie not just for the datapoint selected.

if (series.Index == (nuint)selectedSeriesIndex ; dataIndex == (nuint)selectedDataPointIndex)<br>
{
   series.Style.PointLabelStyle.LabelOffset = new UIOffset(0, -50);
   return new TKChartPointLabel(dataPoint, series, string.Format("{0}%", percentage));
}

I add an image with desired behavior.

Regardsk

[Adrian]

Hello, Enrique,

Currently TKChart does not support manipulation of only one point label in the series out of the box. I logged this in our feedback portal where you can vote or comment this feature request. We will consider implementing such functionality in a future version.

Regards,
Adrian
Telerik