Column2d graph values are overlapping

[veeramani.arthanari]

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.

[Akash Biswas]

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.

[veeramani.arthanari]

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

[Akash Biswas]

Hi,

 

Please check this sample fiddle using the canvasTopPadding and canvasBottomPadding attribute for your scenario mentioned.

Sample fiddle : https://jsfiddle.net/tk173xcq/

 

Thanks,

Akash.

[veeramani.arthanari]

Hi Akash,

Thanks for response. But If all the values are positive, There's a space in graph bottom. I know that's how it'll works, but is there anyway we can balance this both .?

Thank you.

 

[Akash Biswas]

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.

[RobertBup]

Thanks, you have pointed out some excellent points, i as well believe this is a very superb website.
This is actually the kind of information i have been trying to find.
Have a good day.