How to display the data on top of Bar chart bar always

Recommended Posts

Hello all,



I have a bar chart with less width ranging from lower values to higher values. But in some cases, bar values or placing inside the bar. Because of the range and height of the chart ..some times

bar values or inside the bar..which is readable to the client. 


Please find attached image chart...In case if you have any resolution ..Please help us.




Share this post

Link to post
Share on other sites
On 5/1/2016 at 11:18 PM, Gagan Sikri said:



You have to specify chart attribute `placeValuesInside` and its value as `0` to display all the values outside data plot (column). Please refer to this JSFiddle sample for the same: http://jsfiddle.net/s7t8F/1461/

This doesn't work if the bar is too big. Is there another fix for this? I've tried the adding the padding and margins properties to my chart, but the value is still placed inside the bar.

Share this post

Link to post
Share on other sites

Hi Israel,


Yes, when data plot value is large and close to the maximum Y-axis value the value is showing inside through the attribute "placeValuesInside" attribute is set as "0".

In that case you can set the "canvasTopPadding" attribute to add additional space on top of the canvas to display the value on top of the columns. Please check the below sample fiddle for reference :


Please note : For bar(horizontal) visualization use "canvasRightPadding" attribute instead.




Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now