Sizing charts in ChartLayout

[Jonp]

Hi,
I have difficulties sizing charts using tChartLayout. I have five charts in one row. The first chart should have a left axis, while the other four should just have a line with no labels or ticks. That is easily achieved by setting only the left axis on the leftmost chart to visible.
I managed to get the charts to be the same size, by setting .... LeftAxis.Resizecharts to false for the leftmost chart but then the axis on the leftmost chart does not show the labels (only the ticks). If I, in my naivety, add a marginleft to the leftmost chart then I am back to square one: Visible axis labels , but more narrow chart.I hope there is a solution for this.
Below is the code (The form is just blank)
Best
Jon

Code: Select all

unit Gtest;

interface

uses
  Winapi.Windows, Winapi.Messages, System.SysUtils, System.Variants, System.Classes, Vcl.Graphics,
  Vcl.Controls, Vcl.Forms, Vcl.Dialogs, VCLTee.TeeChartLayout, Vcl.StdCtrls,
  VCLTee.TeePNG,  VCLTee.TeExport,  VclTee.TeeGDIPlus,
  VCLTee.TeEngine, Vcl.ExtCtrls, VCLTee.TeeProcs, VCLTee.Chart, VCLTee.Series,
  VCLTee.TeeEdit,  VCLTee.TeePreviewPanel;

type
  TForm3 = class(TForm)
    procedure FormCreate(Sender: TObject);
  private
    { Private declarations }
  public
    { Public declarations }
    Procedure AddCharts;
  end;

var
  Form3: TForm3;
  ChLay: TChartLayout;
implementation

{$R *.dfm}

Procedure FormatChart(ch: Tchart);
Begin
    Ch.Border.Visible:=False;
    Ch.MarginLeft:=3;
    Ch.MarginRight:=3;
    Ch.View3D:=False;
    Ch.Legend.Visible:=False;
    Ch.BottomAxis.Grid.Visible:=False;
    Ch.LeftAxis.Grid.Style:=psClear;  //psDot;
    Ch.LeftAxis.Grid.SmallDots:=True;
    Ch.LeftAxis.Grid.Visible:=False;
    Ch.Walls.Visible:=False;
    Ch.Walls.Right.Visible:=False;
    Ch.Walls.Left.Visible:=True;
End;

procedure TForm3.AddCharts;
var ChartCounter : Integer;
    tmp,tmp2 : TChartSeries;
begin
  ChLay:=TchartLayout.Create(self);
  ChLay.Parent:=self;
  ChLay.Top:=20;
  ChLay.Left:=20;
  ChLay.Columns:=5;
  ChLay.Width:=Form3.Width- ChLay.Left*2;
  ChLay.Height:=Form3.Height-40;
  ChLay.HorzScrollBar.Visible:=False;
  ChLay.ChartWidth:=ChLay.Width div ChLay.Columns -20 ;


  for ChartCounter:=0 to 4 do begin
    // Create two series
    tmp:=TLineSeries.Create(Self);
    tmp.FillSampleValues;
    tmp2:=TLineSeries.Create(Self);
    tmp2.FillSampleValues;

    // Set a different color for each series
    tmp.Color:=GetDefaultColor(ChartCounter);
    tmp2.Color:=GetDefaultColor(ChartCounter+10);
    // Add series to layout
    ChLay.Add('Chart '+IntToStr(ChartCounter)).AddSeries(tmp);
    ChLay.charts[ChartCounter].chart.addseries(tmp2);
    FormatChart(ChLay.Charts[ChartCounter].Chart);


   // Special case for leftmost chart
     if ChartCounter mod 5 <> 0  then Begin
          ChLay.Charts[ChartCounter].Chart.LeftAxis.Labels:=False;
     End else Begin
        ChLay.Charts[ChartCounter].Chart.LeftAxis.ResizeChart:=False ;
        //ChLay.charts[ChartCounter].Chart.MarginLeft:=20;
     End;

  end;  // for

end; // addcharts

procedure TForm3.FormCreate(Sender: TObject);
begin
   AddCharts;
end;

end.

[Yeray]

Hello Jon,

TChartLayout is designed to have all the charts with the same size, including the axes. If you show the axis in some of them, part of the chart "zone" (BoundsRect) is used to draw the labels etc. So that's per design.
However, once all the charts have been added, you could tweak the BoundsRect. Ie:

Code: Select all

  with ChLay.Charts[0].Chart.Axes.Left do
    wOffset:=MaxLabelsWidth+TickLength+LabelsSeparation;

  lOffset:=0;
  for ChartCounter:=1 to 4 do begin
     with ChLay.Charts[ChartCounter].Chart do begin
        l:=BoundsRect.Left-lOffset;
        t:=BoundsRect.Top;
        w:=BoundsRect.Width-wOffset;
        h:=BoundsRect.Height;
        BoundsRect:=Rect(l, t, l+w, t+h);
     end;
     lOffset:=wOffset*ChartCounter;
  end;

[Jonp]

Dear Yeray,
Thanks a lot - this is nearly exactly what I wanted. However, the leftmost chart is still a little bit smaller. It seems that some factor is missing in the wOffset calculation.
Best
Jon

[Yeray]

Hello Jon,

Try adding Axes.Left.Axis.Width to the wOffset.

[Jonp]

Hello,
That improves things, but the leftmost chart is still a bit more narrow.
Best,
Jon

[Yeray]

Hello,

This is what I get, where I measure 61 pixels in all the bottom axes.

layout.png (24 KiB) Viewed 7587 times

Note this is without adding Axes.Left.Axis.Width to the wOffset and commenting the ResizeChart line:

Code: Select all

   // Special case for leftmost chart
     if ChartCounter mod 5 <> 0  then Begin
          ChLay.Charts[ChartCounter].Chart.LeftAxis.Labels:=False;
     End else Begin
        //ChLay.Charts[ChartCounter].Chart.LeftAxis.ResizeChart:=False ;
        //ChLay.charts[ChartCounter].Chart.MarginLeft:=20;
     End;

[Jonp]

Hi,
Strange. I get:

Capture.PNG (31.35 KiB) Viewed 7577 times

The code is the original code, plus your suggested changes.

(Rad Studio 11.2 and the latest version of Teechart Build 2023.39.231109)

Best,
Jon

[Yeray]

Hello,

I tested it again and changed the way to calculate the wOffset again. This way looks more stable:

Code: Select all

  ChLay.Charts[0].Chart.Draw;
  with ChLay.Charts[0].Chart do
       wOffset:=BoundsRect.Width-Axes.Bottom.IAxisSize;

  ChLay.Charts[1].Chart.Draw;
  with ChLay.Charts[1].Chart do
       wOffset:=wOffset-(BoundsRect.Width-Axes.Bottom.IAxisSize)+2;

  lOffset:=0;
  for ChartCounter:=1 to 4 do begin
     with ChLay.Charts[ChartCounter].Chart do begin
        l:=BoundsRect.Left-lOffset;
        t:=BoundsRect.Top;
        w:=BoundsRect.Width-wOffset;
        h:=BoundsRect.Height;
        BoundsRect:=Rect(l, t, l+w, t+h);
     end;
     lOffset:=wOffset*ChartCounter;
  end;

Here the test project:

ChartLayoutTest.zip

(1.76 KiB) Downloaded 322 times

[Jonp]

Hi Yeray,
Yes, that works fine.
Interestingly, I just installed Rad Studio 12. Your previous version works in that, as does the new one.
In 11.2, only the new one works.
Thanks a lot for your effort. It is rather useful to obtain something similar to panel graphs in R.
Best
Jon

[Yeray]

Hello Jon,

I'm glad to hear it works fine now!