Align multiple charts

Question

I have seen this answer, but what happens if you have three charts? And in general, have n charts stacked one ontop of each other and you want the chart bodies (areas) to align with each other?

I would be satisfied to see a result for three charts, but a function that takes a list of charts and aligns them is the most useful.

Also, does this answer presume the charts already have all data in them? What if the data is added at runtime dynamically and you need to keep the charts aligned? The problem is the y-axis labels may change in size as new data appears ( a negative sign appears, or more decimal places, more digits, etc), pushing the chart body to the right, and therefore misligning them with other chart areas stacked above/below it.

Being able to assign a stable Y-axis label extent no matter how big the label gets goes along way to solving some of these problems. How is this done?

Have a look [here](https://stackoverflow.com/questions/27042419/how-to-draw-four-or-more-workareas-horizontally/27046961#27046961) and maybe [here](https://stackoverflow.com/questions/37141291/aligning-and-synchronising-x-axes-in-ms-chart-doesnt-work/37142989#37142989) - Note while you can set the InnerplotPosition the extent of the labels can only be influenced indirectly; best allow for enough space and also format the values to restrict their size. — TaW, Jul 13 '19 at 21:32

score 0 · Answer 1 · answered Jul 13 '19 at 21:52

0

This should work, assuming charts is an array of all the charts -

var referenceR = charts
                   .OrderBy(c => c.ChartAreas[0].InnerPlotPosition.ToRectangleF().Width)
                   .FirstOrDefault();

 foreach(var chart in charts)
 {
       chart.Left = referenceR.Left;
       chart.Size = referenceR.Size;
       var r = chart.ChartAreas[0].InnerPlotPosition.ToRectangleF();
       chart.ChartAreas[0].InnerPlotPosition = new ElementPosition(referenceR.Left, r.Top, referenceR.Width, r.Height);
 }

answered Jul 13 '19 at 21:52

Gaurav Mathur

804
5
14

All the chart areas are blank.. Not even the axis display;. – Ivan Jul 13 '19 at 23:31
oops :) Can you try and set debugger and see if referenceR is a chart with minimum width. If yes then `r` has correct `RectangleF` values. I am sorry I do not have any charts data or charts, I just extended the same logic which you shared here (https://stackoverflow.com/questions/37567374/how-can-i-align-the-innerplots) – Gaurav Mathur Jul 14 '19 at 00:41
Chart only show anything once you have added a DataPoint. – TaW Jul 14 '19 at 07:34

Ivan · Answer 2 · 2019-07-14T12:33:27.260

This solution worked. I realize it is not what I asked, but for now this seems to be the internal design of the chart control "promoted" for solving this sort of problem.

Instead of having three charts, I have one chart with three areas. Then solving the alignment issue is trivial:

   chart1.ChartAreas["ChartArea2"].AlignWithChartArea = "ChartArea1";
   chart1.ChartAreas["ChartArea3"].AlignWithChartArea = "ChartArea1";

And everything stays aligned beautifully as data is inserted in realtime.

Align multiple charts

2 Answers2