Hi
I use a chart Kendo UI, (using typescript). I have a problem with the tooltip
formatting and the same problem with the label (on series).
I have a formatted value (as string, but not the format type)
and I want to replace the original value with that.
Is it possible to replace
the value? then how?
*** Must say I have seen the example chartTooltip.html
another question , I’ve
tried to replace the value with escape char “\”, Before any character I've
“\\\\”, which is the result.
result : see (kendo chart.png)
------------------------------------------------------------------------
i tried to do that also
namespace prefix.html.chart
{
export class chart
{
public formatnewABC(v: any, vf: any): any
{
return (vf);
}
...
...
// build chart source code
// this.ser - current series object properties
var vf: string = this.data.getFormattedValue(i, j); // contains format value (string)
this.ser["labels"] = {
visible: true,
template: "#= prefix.html.chart.PnChart.prototype.formatnewABC(dataItem," + "\"" + vf + "\"" + " ) #"
};
}
}
result : see (kendo chart2.png)
Thanks in advance for your help
7 Answers, 1 is accepted
In general, when the value of the Tooltip and the labels have to be formatted I can suggest using their template properties with combination with kendo.toString() method:
http://docs.telerik.com/kendo-ui/framework/globalization/numberformatting#number-formatting
http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart#configuration-series.labels.template
http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart#configuration-series.tooltip.template
Also, I can suggest checking our article for templates and escaping characters:
http://docs.telerik.com/kendo-ui/framework/templates/overview#templates-overview
I also made a Dojo example demonstrating different formatting and escaping:
http://dojo.telerik.com/ASuYu
I hope this is helpful.
Regards,
Stefan
Telerik by Progress
Hi Stefan,
Thanks for the answer, but I want to be more clear in my explanation.
First of all I wanted to say that I've seen all the links are attached, they do not helped me get to a solution.
I have an array of values I load into the chart (series data) , and another array with the same formatted values that I want to represent in the tooltip and label.
Thank you for your attention
Thank you for the clarification.
I can assume that the desired result is to have a second array only with the formatted data. If that is correct, the data can be accessed by using a function inside the template, but the data will not be mapped automatically, and a custom approach has to be used.
The other option is instead of having a second array, to have the formatted value as a field in the data object and to access it through the dataItem e.g. dataItem.formatedValue.
Regards,
Stefan
Telerik by Progress
Hi Stefan,
please elaborate about this custom approach.
i have tried also to pass to the template (e.g. tooltip template) other variables other than the predefined ones, having the template call my function with these parameters.
When doing so, i see the template gets called for each tooltip assignment (for each data point) with the CORRECT values. However, when looking at the chart i see all tooltips (also label) show the value from the LAST data point for all data points.
As for the mismatch, I was not able to reproduce it on my end.
Could you please send a runnable example or modify the Dojo example to reproduce the scenario and the issue, and I will gladly investigate and assist further.
Regards,
Stefan
Telerik by Progress
I made 2 examples, the first with regular format labels
The first example of true values can be seen, however the second example the values are incorrect.
now i hope the scenario more clean than before
thanks
I noticed that in the provided example the numbers are not matching at all because of the different indexes.
The easier approach will be to add the formatted array values to the original data and display them on the Chart, to ensure that the order will be correct.
Please check the example demonstrating this:
http://dojo.telerik.com/ASuYu/2
Regards,
Stefan
Telerik by Progress