valueFormatString: String

Comments 35

1. How can axis label show 10K, 30K, …?

   • You need to use suffix property:

     axisX:{
     title: "Axis Labels with formatting",
     valueFormatString: "#,##0,.",
     suffix:"K"
     }

2. Can chart automatically format axis label by adding suffix ‘K’, ‘M’, ‘B’…?
   Or can you provide function-type option to help me customize axis label?

   This feature can apply to tooltip also.

   • Update:Custom Formatting is available in v1.7.0. Please checkout label formatter.
     

     As of now this feature isn’t available. But am thinking of implementing the same in future versions.

     As of now custom formatting option is available for TooTips but not for axis.
     https://canvasjs.com/docs/charts/basics-of-creating-html5-chart/tool-tip/

3. Could you please implement custom formating option for axis in 1.4.0? Current implementation of valueFormatString is very poor.

   • Update:Custom Formatting is available in v1.7.0. Please checkout label formatter.
     

4. The first character of the AM/PM designator. (upper case) should be “TT” instead of “T”

   • Corrected the same. Thanks for reporting

5. MMM return +1 month, how could i -1 to get correct month

   • In JavaScript month component ranges from 0-11. Please refer to this thread for more info.

     • I got that thank you sir!

6. Again !! i have a question.. Is that possible to create own format string value and then when you zoom it, the format can change

   • Hi Stven,

     Sorry, as of now we don’t have this feature.

7. I want to show the day-of-month for Sundays, but show M/T/W/Th/F/S for other days of the week. Is there any way to accomplish this?

   If not, providing a custom format function would be nice :)

   valueFormatString: function(val) { return “whatever string you calculate”}

   • Robert,

     This feature is not available as of now. But surely we will consider this for future versions. Thanks for your suggestion.

   • Update:Custom Formatting is available in v1.7.0. Please checkout label formatter.
     

8. how can i mentioned string values in x axis..? say for example i want to have x axis point like “apple” , “orange” , “mango” like this.. I thought it will be done by changing “valueFormatString”. but i don’t know how to proceed further.. please help me..

   • karthik,

     You can use label property instead of x values.

9. Hi,
   how can I use superscript in value as a suffix? Please help me, cause I need it to my school project. Thanks

   • I need to use html tags like and …

   • I need to use html tags like “sup” and “sub”…

     • gaspar,

       Sorry, this feature is not available as of now.

10. Hi,
    I have an array string that contains the date in format YYYY:MM:DD HH:mm:ss relative to the data. I want to put them into the X axis, but only the HH:mm:ss part. How I can do it? I’m newbie with js and canvasjs.

    • Andrew,

      You can use String split() Method in date format (YYYY:MM:DD HH:mm:ss) to get just time (HH:mm:ss) of array string and pass it to X-axis

      • Thanks, it works wery well. But in console returns

        Uncaught TypeError: Cannot read property ‘x’ of undefined

        where the “x” is the first number of the date. My cose is the follow:

        Time[i] = row.date_data.split(” “);
        …
        dpsHPower[j] = {label: Time[j][1], y: Number(HPower[j])};
        …

        the “j” because it is inside a for cicle. dpsHPower is a dataPoints of the chart, HPower is the y data and Time[j][1] is the string to show in the x axis.
        Is it correct?

11. Hi,
    Is there any way to split an x axis label over multiple lines (i.e. insert a line break into the string)? I’d like to display something like the below

    14:00
    Sat 1-Jan-16

    centered on the axis tick mark. Having that on one line is too long. Having it rotated 90 degrees makes it too tall. Using labelwrap doesn’t let me split it logically (i.e. keeping the day name on the same line as the date). Is there any way to do this?

    Thanks

    • David,

      This feature is not available as of now. But you can use labelMaxWidth and labelWrap.

12. How can axis label show North, North-est, …?

13. I need to convert my number in this format for axisY. How can i do that.

    10 => 10.00
    10.5 => 10.50
    10.51 => 10.51
    10.556 => 10.56

    Assistance will be highly appreciated.

    • If you are trying to format the y-Value shown in indexLabel, you can use yValueFormatString. And if you are trying to format labels over y-axis, you can use valueFormatString.

14. For xvalueformatstring, I want to be able to show the week range like “Monday June 1, 2016 – Monday June 8, 2016”, how to do this ?

    looking forward to response thanks!

    • Jason Willsboro,

      xValueFormatString defines how x values must be formatted before they appear on the indexLabel or toolTip and using valueFormatString the same feature is not achievable.
      Here is an example to show labels as per your requirement using labelFormatter and intervalType.

15. thank you .

16. HI,

    I am using doughnut in my dashboard. am not able to format the number displayed. Like it shows 1342768.67
    But o require it to be with comma separator like 1,342,768.67

    Thanks,
    Veronica

    • Veronica,

      By default labels and indexLabels are comma-separated. To customize format-string of indexLabels and toolTip you can use yValueFormatString.