veeramani.arthanari

Column2d graph values are overlapping

Recommended Posts

Hi,

I'm getting value overlapping issue in Column2d graph. I've used your example only just to cross-check how it's working.

From this link http://jsfiddle.net/fusioncharts/s7t8F/, I've edited the Jan value from 420000 to 980000, and added the attribute "showValues": "1".

You can see the value  $980k is overlapping above the graph column. Is there any option to avoid this issue.?

Thanks in advance.

Screenshot 2020-02-17 at 2.31.58 PM.png

Share this post


Link to post
Share on other sites

Hi,

 

The values of a Column chart, could be placed either inside or outside the column plots by using "placeValuesInside" attribute. Now when they are placed outside, for the scenario when there is not enough space to display the value within the canvas but outside the column plots, the values are pushed inside automatically.

If you do not want the values to be pushed inside, you can use either of the below options.

1. You can set the yAxisMaxValue attribute to increase the y-axis upper limit, so that there is enough space to display the value outside the plot but inside the canvas.

2. You can also set a padding on top of the canvas by using "canvasTopPadding" and set the padding in pixels as below :

"canvasTopPadding": "30" for a 30 pixels padding.

 

Thanks,

Akash.

Share this post


Link to post
Share on other sites

Hello Akash,

Thanks for your response. But what if I've the data both minimum and maximum at extreme like below

{
          "label": "Jan",
          "value": "980000"
        },
        {
          "label": "Feb",
          "value": "-910000"
        },

 

One with positive extreme and another with negative extreme. In my issue, I'm having the data 6.9 and -150.8, so it's still overlapping even after increasing the minimumYaxis and maximumYaxis. I'm calculating this dynamically by adding 5 to it, so 6.9 to 11.9 for maximumYaxis and -150.8 to -155.8 for minimumYaxis.

 

Adding canvasTopPadding or canvasBottomPadding is giving issue in other scenarios where if all the value in there are positive. Please let us know if there's any solution.

 

Thanks in advance :)

Screenshot 2020-02-19 at 2.57.26 PM.png

Share this post


Link to post
Share on other sites

Hi,

 

For the scenario when you do not want the values to be pushed inside the plots automatically, this was one of the ways to avoid this situation by using "canvasTopPadding" or "canvasBottomPadding" or both.

Another way is to use the "yAxisMinValue" or "yAxisMaxValue" or both to set the y-axis minimum or maximum value explicitly so that it gets sufficient space to display the values outside the plots, as suggested earlier.

Afraid, these are the only possible work-around solution for your scenario mentioned.

 

Thanks,

Akash.

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