You must be logged in to post your query.
Home › Forums › Chart Support › Round Y-Axis Number Label
Tagged: canvasjs, Column, label, MVC, Y axis
I am trying to round the Y-Axis Number Label to the nearest whole number. This graph in particular could hold numbers as high as 100, so I did not think assigning a static variable for the Y-Axis Interval would be a good option.
Below is a JSFiddle I constructed to replicate my issue with the Y-Axis Number Labels showing in decimal places versus the whole number.
Any advice would be very appreciative!
You can use valueFormatString to show the labels as a whole number. Also if you want to display labels only at the whole number position, you can use interval property. Please check the below code snippet –
Kindly check this updated JSFiddle for a working example.
While this code works perfectly, there could be some fluctuation on the Y axis values. There could be, for example, 50 as the value of a datapoint; and the interval display would be rather crammed to fit it all inside if the interval was just set to 1. Is there a way to make this more dynamic?
Based on your scenario, removing interval property will allow the library to auto-calculate interval according to the range of data. Please take a look at this updated JSFiddle for an example on chart with auto-calculated interval.
I am having a difficult time having the Y-Axis display correctly.
Here’s a sample JsFiddle to show my issue: https://jsfiddle.net/oed05qba/1/
Axis labels are shown at every interval which is auto-calculated based on parameters like axis minimum, axis maximum, etc. In your case, since the range of Y-Axis is small the labels are shown in decimals. Hence, using the valueFormatString will just round off the labels to the nearest whole number but won’t affect the interval, as a result, the labels might get repeated.
You must be logged in to reply to this topic. Login/Register