Aligning Multiple Vertical Charts

[arcticio]

I have three charts and all share the same x axis data, but different Y data. The charts would look extremely better, if it’s possible to somehow vertically align the y axes, so the upper 2 X axes could be dropped. I’d propose to allow to give a fixed margin on either side.

• This topic was modified 8 years, 5 months ago by arcticio.

[Sanjoy]

Arcticio,

Thanks for your feed-back. Are you looking for axisY/Y2 margin?

[arcticio]

I tried, but it somehow depends on the axes labels. Here I put all six to 160px to illustrate.

• This reply was modified 8 years, 5 months ago by arcticio.

[Sanjoy]

Arcticio,

As of now the exact same feature is not available. You have to do little manipulation using labelMaxWidth and margin of axis.

[carlosnpinto2]

Is this feature on the CanvasJS backlog?
I also have the same problem. I want to have two vertically aligned charts and have the same width of the chart area for both.

Intended behaviour

As you can see the width of the chart area for both are the same.

But with CanvasJS I only managed to create this:

Current (wrong) behaviour

Is there a way (with the current version) of recreating the first behaviour?

[Sanjoy]

Hi,

As of now this feature is not available in our library. Here is an workaround to align the axis.

[carlosnpinto2]

My use case is for the Y-Axis to be on the right side, for the left side your solution works perfectly, is it possible to do it if the Y-Axis is on the right?

[Sanjoy]

[update]

We have just released v1.9.6 Beta with Methods & Properties, which allows you to programmatically export chart as image, print chart, access internally calculated values, etc. Please refer to the release blog for more information.

Please check this jsfiddle.

You can do the same for axisY2. Here is updated fiddle with aligning axisY2.