Pie Chart iOS doesnt show values, Android shows decimals

[Jonathan Salomon]

I am checking out the PieCharts and was following the example in the docs for the Donut chart. I am using this markup:

```

    <RadPieChart height="150" allowAnimation="true" row="1">

      <DonutSeries tkPieSeries selectionMode="DataPoint" [items]="convertCycleDataForPieChart(cycle,type)" valueProperty="value" legendLabel="label"
        outerRadiusFactor="0.9" innerRadiusFactor="0.7" expandRadius="0.1">
      </DonutSeries>
      <RadLegendView tkPieLegend position="Left" offsetOrigin="TopRight" width="150" textFormat="%.0f"></RadLegendView>
    </RadPieChart>

```

 

The problem is that on iOS I don't get values in the legend and on Android I do but they have decimals. I tried to add the textFormat directive according what I found in the docs but it does not seem to work.

 

Any advice?

Thanks!

[Jonathan Salomon]

What is forgot to mention is that the valueProperty contains only integers so no decimals.

Also I tried to do what was explained here, but it doesn't work (and I don't see labelFormat as a directive on the RadLegendView: http://stackoverflow.com/questions/41250226/ui-for-nativescript-radcharts-use-labels-with-decimals-by-defaul

[Nick Iliev]

Hello Jonathan,

Behind RadPieChart lies different native controls respectively for iOS and Android and this is the reason for the UX to look and feel different for those two platforms. Both of your cases are expected and even in the documentation article here or in the code sample here will still result in the same outputs as in your case (floating points in Android and no values for the legend in iOS).

Currently, we can not provide a solution for the decimal numbers in Android As a possible workaround for the iOS issue; you can flat your legendLabel data. This way you can pass the valueProperty among with labelLegend from one flatten source (passed as a string).

e.g.
Let's assume that you have data source like this one here.
Now you can interact with the source array and add a value called AmountAndBrand which has string value result of the Amount + Value concatenation.
The source shown should ca produce something like this

getPieSource(): Car[] {
    return [
        { Brand: "Audi", Amount: 10, AmountAndBrand: "10 Audi" },
        { Brand: "Mercedes", Amount: 76, AmountAndBrand: "76 Mercedes" },
        { Brand: "Fiat", Amount: 60, AmountAndBrand: "60 Fiat" },
        { Brand: "BMW", Amount: 24, AmountAndBrand: "24 BMW" },
        { Brand: "Crysler", Amount: 40, AmountAndBrand: "40 Crysler" }
    ];
}

Now that we have a property with flat data you can pass it to your legendLabel

<DonutSeries tkPieSeries selectionMode="DataPoint" [items]="pieSource" valueProperty="value" legendLabel="AmountAndBrand">

And the result for iOS will be as follows:


However, note that Android will still automatically insert the value so you might want to use platform specific code to create an Android version of your doughnut and an iOS one. Here you can find example on how to set up and use custom directive (and the example correctly shows how to build one that differs Android app from iOS one)



Regards,
Nikolay Iliev
Telerik by Progress

[Jonathan Salomon]

Thanks Nikolay!

[Jonathan Salomon]

Hi Nikolay,

Considering that we will buy the Pro version, would it be possible to request that Android will support removal of the decimals? How likely that it will be handled soon? The workaround you provided for iOS is something that we can live with.

Thanks!

[Nick Iliev]

Hello Jonathan,

Indeed it would be nice for the users to control whether they want their values shown as integers or decimals with floating points.However, However, all features in nativescript-telerik-ui-pro are implemented by their priority and overall importance, so what we can do is to log the issue in the feedback portal. There you can discuss it with the developers and track its potential development and also discuss possible workarounds.

For your convenience, I have already logged this issue here. You can join the thread and upvote it and also share your considerations on why this should be implemented to underline its importance for your project.

Regards,
Nikolay Iliev
Telerik by Progress

[Jonathan Salomon]

Thanks again Nikolay!