This is a migrated thread and some comments may be shown as answers.

Trailing zeroes in Tooltip Number Format

10 Answers 108 Views
Chart (HTML5)
This is a migrated thread and some comments may be shown as answers.
David
Top achievements
Rank 1
Iron
Iron
Veteran
David asked on 18 Oct 2017, 01:21 PM

I try to format my tooltip numbers to achieve the following results:

15327 -->15,327

1.034234 --> 1.034

1.02 --> 1.02

Unfortunately, whatever i do i am getting trailing zeroes, such as 1.020

I tried few ways, for example:

lineThird.TooltipsAppearance.ClientTemplate = "#=series.name# (" & IIf(strDollarsTons = "tons", "", "$") & "#= kendo.format(\'{0:N3}\', value)#" & IIf(strDollarsTons = "tons", " ktons", "M") & ")"

also,

"#= kendo.parseFloat(value)#" 

 "#= kendo.format(\'{0:#,###,###.###}\', value)#"

"#= kendo.format(\'{0:N}\', value)#"

Please help

10 Answers, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 23 Oct 2017, 01:15 PM
Hello,

You can try these lines:

kendo.format({0:"#,#.###"}, value) 
kendo.format({0:"#,###,###.###"}, value) 

More details are available at https://docs.telerik.com/kendo-ui/framework/globalization/numberformatting.

Regards,
Rumen
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
David
Top achievements
Rank 1
Iron
Iron
Veteran
answered on 23 Oct 2017, 03:40 PM

Rumen,

In my original post i outlined that tried this approach. It is conceivable that i format it incorrectly in vb. 

Should it look like the following?

lineThird.TooltipsAppearance.ClientTemplate = "#=series.name# (" & "#= kendo.format({0:"#,###,###.###"}, value) #" & ")"

0
Rumen
Telerik team
answered on 26 Oct 2017, 11:47 AM
Hi David,

When you use the kendo.format() method from code behind you should ensure the quotes are escaped with double backslashes. For example #=kendo.format(\\'{0:N2}\\', value)#. More information is available in this article - http://www.telerik.com/help/aspnet-ajax/htmlchart-troubleshooting-escaping-special-symbols.html.

Best regards,
Rumen
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
David
Top achievements
Rank 1
Iron
Iron
Veteran
answered on 26 Oct 2017, 05:42 PM
Unfortunately "#=series.name# ($#= kendo.format(\\'{0:#,###,###.#####}\\', value)#M)" does not work
0
Rumen
Telerik team
answered on 31 Oct 2017, 12:31 PM
Hello,

Here is an example of how to set a Kendo template via a VB.NET codebehind:

Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
    Dim series = TryCast(RadHtmlChart1.PlotArea.Series(0), BarSeries)
    Dim formatString = "#=dataItem.ProductName#<br />#=dataItem.Manufacturer# (#= kendo.format(\'{0:C2}\', dataItem.Price)#)"
    series.TooltipsAppearance.ClientTemplate = formatString
End Sub

You can also find attached a sample project, which you can use as a base to proceed with your implementation.

Regards,
Rumen
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
David
Top achievements
Rank 1
Iron
Iron
Veteran
answered on 31 Oct 2017, 01:21 PM

Rumen, your example obviously will work, but it is not the answer to the question i asked. I wanted flexible way to format numbers without trailing zeroes.

For example if i will use solution similar to one you recommended : {0:N3},

i will get the following results (trailing zeroes):

15327 -->15,327.000
1.034234 --> 1.034
1.02 --> 1.020

However, what i am looking for is the following:

15327 -->15,327
1.034234 --> 1.034
1.02 --> 1.02

0
Rumen
Telerik team
answered on 02 Nov 2017, 01:48 PM
Use kendo.toString(13423532327.230,'##,#.###') instead of kendo.format() to produce "13,423,532,327.23".

See this article - https://docs.telerik.com/kendo-ui/framework/globalization/numberformatting#custom.

Hope this helps.

Regards,
Rumen
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
David
Top achievements
Rank 1
Iron
Iron
Veteran
answered on 02 Nov 2017, 07:47 PM

Rumen,

  It still does not work.

  I tried the following:

lineThird.TooltipsAppearance.ClientTemplate = "#=series.name# (" & "#= kendo.toString(value,\'#,###,###.###\') #" & ")"

   Can you please create micro project that will assign ClientTemplate on back end the way you suggest?

Thank you

 

0
Accepted
Rumen
Telerik team
answered on 08 Nov 2017, 09:18 AM
To make it working in VB.NET you have to escape the # symbols too:

Dim formatString = "#= kendo.toString(123456,\'\\#,\\#\') #"

Please, find attached my test project.

Regards,
Rumen
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
David
Top achievements
Rank 1
Iron
Iron
Veteran
answered on 09 Nov 2017, 05:42 PM

That looks good

Thank you

Tags
Chart (HTML5)
Asked by
David
Top achievements
Rank 1
Iron
Iron
Veteran
Answers by
Rumen
Telerik team
David
Top achievements
Rank 1
Iron
Iron
Veteran
Share this question
or