Aligning Multiple Charts in Flex Charting

Question

I have multiple line charts in Flex Charting (3.x). The charts (and number of charts) are being dynamically generated, and are either of "type A" or "type B." The type of data on the Y-axis is different for type A then it is for type B. The x-axis is time.

Each chart is placed in its own VBox (with a few other things) that make up a larger canvas of the Type A or Type B. This VBox is given an absolute X position.

It is very high priority that the different charts line up, so that comparisons (in time) can be made.

What ends up happening is that the vertical axis for some charts takes up more width then others, so the charts are no longer aligned in time.

I have tried playing the VerticalAxisRenderers/AxisRenderer width, but that had no effect.

Any advice would be greatly appreciated.

Answer 1

You can try to set the same gutter left for the both charts. That might help. I had a similar issues, but haven't figured a better answer yet.

Answer 2

I am doing the same thing. If you can use the same HorizontalAxis using a DateTime axis it works great.. you just need to parse the data into an appropriate dateTime. But, if like me, you need to chart the Time and a parsing the Time values into datetime then provides gaps in data... so far, I have not found an answer, because I am using a Horizontal Axis - Category Axis, but I will try switching that to a Numeric Axis and let you know what I come up with. if anything...

Answer 3

You need to make sure the component uses the same width, height, padding and gutter settings.

For the gutter, which solves what you described, you can find the right info and sample code here:

http://livedocs.adobe.com/flex/3/html/help.html?content=charts_formatting_03.html