Problems with TeePreviewPanel
Problems with TeePreviewPanel
Problems with TeePreviewPanel
Please help!
I used the component TeePreviewPanel with 2 charts. On both charts I Changed the position of the Legend in the middle of the Chart Rect. I put also some annotations on both charts. In the TeePreviewPanel, the charts are exactly like on screen, but if I print the page, on the listing a can’t see the Legend and the annotations on the second Chart.
If I print like a bitmap, I can see the Legend and the annotation of both charts, but in this case the texts and graphics do not appear very well.
I suppose there is an error in the component TeePreviewPane->Print, when the option Bitmap of the component is set to false(perhaps the index of the chart in the panel???).
Mihael Avram, Romania
Please help!
I used the component TeePreviewPanel with 2 charts. On both charts I Changed the position of the Legend in the middle of the Chart Rect. I put also some annotations on both charts. In the TeePreviewPanel, the charts are exactly like on screen, but if I print the page, on the listing a can’t see the Legend and the annotations on the second Chart.
If I print like a bitmap, I can see the Legend and the annotation of both charts, but in this case the texts and graphics do not appear very well.
I suppose there is an error in the component TeePreviewPane->Print, when the option Bitmap of the component is set to false(perhaps the index of the chart in the panel???).
Mihael Avram, Romania
-
- Site Admin
- Posts: 14730
- Joined: Mon Jun 09, 2003 4:00 am
- Location: Banyoles, Catalonia
- Contact:
Hi Mihael,
It's most likely that the problem is because you are using absolute positions for the legend and annotations. You should position them with a relative position to some TeeChart object, for example: axis, ChartRect, series points, etc.
It's most likely that the problem is because you are using absolute positions for the legend and annotations. You should position them with a relative position to some TeeChart object, for example: axis, ChartRect, series points, etc.
Best Regards,
Narcís Calvet / Development & Support Steema Software Avinguda Montilivi 33, 17003 Girona, Catalonia Tel: 34 972 218 797 http://www.steema.com |
Instructions - How to post in this forum |
TPreviewPanel problems - it doesn't work
Thank you but it doesn't work.
I put Legend->Custom, Left=50%, Top=50% with TeeChart7.07Builder5.exe and I obtained the same result, I can't see it on the paper, but I see it on the TPreviewPanel. Please try to verify.
My best regards,
Mihael Avram
I put Legend->Custom, Left=50%, Top=50% with TeeChart7.07Builder5.exe and I obtained the same result, I can't see it on the paper, but I see it on the TPreviewPanel. Please try to verify.
My best regards,
Mihael Avram
Hi Mihael,
to print it to a correct position through the ChartPreviewer you will have to use similar code to the following (to set manually the Legend position getting the Bounds of the Chart and Paper) :
Before to do that you should save the Legend position to assign it again when the Chart has been printed.
to print it to a correct position through the ChartPreviewer you will have to use similar code to the following (to set manually the Legend position getting the Bounds of the Chart and Paper) :
Code: Select all
procedure TForm1.Chart1BeforePrint(Sender: TCustomTeePanel; Canvas: TCanvas;
var R: TRect);
begin
Chart1.Legend.Left:=ChartPreviewer1.PreviewPanel.BoundsRect.Left+
Chart1.Legend.Left;
Chart1.Legend.Top:=ChartPreviewer1.PreviewPanel.PaperRect.Top+
ChartPreviewer1.PreviewPanel.BoundsRect.Top+
Chart1.Legend.Top;
end;
Pep Jorge
http://support.steema.com
http://support.steema.com
Problems with TeePreviewPanel
Hi,
Thank you for your answer but that didn't resolve yet my problem. I want to print from a TeePreviewPanel and not from a ChartPreviewer, I try to be more explicit. Here is my code:
unit1.h
//---------------------------------------------------------------------------
#ifndef Unit1H
#define Unit1H
//---------------------------------------------------------------------------
#include <Classes.hpp>
#include <Controls.hpp>
#include <StdCtrls.hpp>
#include <Forms.hpp>
#include "TeePreviewPanel.hpp"
#include <Buttons.hpp>
#include <Chart.hpp>
#include <DBChart.hpp>
#include <ExtCtrls.hpp>
#include <Series.hpp>
#include <TeEngine.hpp>
#include <TeeProcs.hpp>
#include "TeeTools.hpp"
//---------------------------------------------------------------------------
class TForm1 : public TForm
{
__published: // IDE-managed Components
TDBChart *DBChart1;
TDBChart *DBChart2;
TDBChart *DBChart3;
TLineSeries *Series1;
TLineSeries *Series2;
TLineSeries *Series3;
TTeePreviewPanel *TeePreviewPanel1;
TSpeedButton *SpeedButton1;
TAnnotationTool *ChartTool1;
TAnnotationTool *ChartTool2;
TAnnotationTool *ChartTool3;
TLabel *Label1;
void __fastcall SpeedButton1Click(TObject *Sender);
private: // User declarations
public: // User declarations
__fastcall TForm1(TComponent* Owner);
};
//---------------------------------------------------------------------------
extern PACKAGE TForm1 *Form1;
//---------------------------------------------------------------------------
#endif
unit1.cpp
#include <vcl.h>
#pragma hdrstop
#include "Unit1.h"
//---------------------------------------------------------------------------
#pragma package(smart_init)
#pragma link "TeePreviewPanel"
#pragma link "TeeTools"
#pragma resource "*.dfm"
TForm1 *Form1;
//---------------------------------------------------------------------------
__fastcall TForm1::TForm1(TComponent* Owner)
: TForm(Owner)
{
Series1->FillSampleValues(8);
Series2->FillSampleValues(8);
Series3->FillSampleValues(8);
DBChart1->PrintProportional = false;
DBChart2->PrintProportional = false;
DBChart3->PrintProportional = false;
DBChart1->PrintMargins = Rect(2,2,2,70);
DBChart2->PrintMargins = Rect(2,35,2,35);
DBChart3->PrintMargins = Rect(2,65,2,2);
DBChart1->Legend->CustomPosition = true;
DBChart1->Legend->PositionUnits =muPercent;
DBChart1->Legend->LeftPercent = 30;
DBChart1->Legend->TopPercent = 20;
DBChart2->Legend->CustomPosition = true;
DBChart2->Legend->PositionUnits =muPercent;
DBChart2->Legend->LeftPercent = 40;
DBChart2->Legend->TopPercent = 30;
DBChart3->Legend->CustomPosition = true;
DBChart3->Legend->PositionUnits =muPercent;
DBChart3->Legend->LeftPercent = 70;
DBChart3->Legend->TopPercent = 70;
ChartTool1->Shape->CustomPosition = true;
ChartTool1->PositionUnits = muPercent;
ChartTool1->Shape->Left = 30;
ChartTool1->Shape->Top = 65;
ChartTool2->Shape->CustomPosition = true;
ChartTool2->PositionUnits = muPercent;
ChartTool2->Shape->Left = 50;
ChartTool2->Shape->Top = 65;
ChartTool3->Shape->CustomPosition = true;
ChartTool3->PositionUnits = muPercent;
ChartTool3->Shape->Left = 70;
ChartTool3->Shape->Top = 45;
// add to preview
TeePreviewPanel1->Panels->Add(DBChart1);
TeePreviewPanel1->Panels->Add(DBChart2);
TeePreviewPanel1->Panels->Add(DBChart3);
}
//---------------------------------------------------------------------------
void __fastcall TForm1::SpeedButton1Click(TObject *Sender)
{
TeePreviewPanel1->Print();
}
//---------------------------------------------------------------------------
Here are my outputs:
Please give me a solution for my example.
And, at the end, another question: how can I select a chart from TeePreviewPanel in order to change at runtime the PrintMargins with the mouse? I want to see all the charts on the panel when I change the PrintMargins.
Thank you for your time
My best regards
Mihael Avram
Thank you for your answer but that didn't resolve yet my problem. I want to print from a TeePreviewPanel and not from a ChartPreviewer, I try to be more explicit. Here is my code:
unit1.h
//---------------------------------------------------------------------------
#ifndef Unit1H
#define Unit1H
//---------------------------------------------------------------------------
#include <Classes.hpp>
#include <Controls.hpp>
#include <StdCtrls.hpp>
#include <Forms.hpp>
#include "TeePreviewPanel.hpp"
#include <Buttons.hpp>
#include <Chart.hpp>
#include <DBChart.hpp>
#include <ExtCtrls.hpp>
#include <Series.hpp>
#include <TeEngine.hpp>
#include <TeeProcs.hpp>
#include "TeeTools.hpp"
//---------------------------------------------------------------------------
class TForm1 : public TForm
{
__published: // IDE-managed Components
TDBChart *DBChart1;
TDBChart *DBChart2;
TDBChart *DBChart3;
TLineSeries *Series1;
TLineSeries *Series2;
TLineSeries *Series3;
TTeePreviewPanel *TeePreviewPanel1;
TSpeedButton *SpeedButton1;
TAnnotationTool *ChartTool1;
TAnnotationTool *ChartTool2;
TAnnotationTool *ChartTool3;
TLabel *Label1;
void __fastcall SpeedButton1Click(TObject *Sender);
private: // User declarations
public: // User declarations
__fastcall TForm1(TComponent* Owner);
};
//---------------------------------------------------------------------------
extern PACKAGE TForm1 *Form1;
//---------------------------------------------------------------------------
#endif
unit1.cpp
#include <vcl.h>
#pragma hdrstop
#include "Unit1.h"
//---------------------------------------------------------------------------
#pragma package(smart_init)
#pragma link "TeePreviewPanel"
#pragma link "TeeTools"
#pragma resource "*.dfm"
TForm1 *Form1;
//---------------------------------------------------------------------------
__fastcall TForm1::TForm1(TComponent* Owner)
: TForm(Owner)
{
Series1->FillSampleValues(8);
Series2->FillSampleValues(8);
Series3->FillSampleValues(8);
DBChart1->PrintProportional = false;
DBChart2->PrintProportional = false;
DBChart3->PrintProportional = false;
DBChart1->PrintMargins = Rect(2,2,2,70);
DBChart2->PrintMargins = Rect(2,35,2,35);
DBChart3->PrintMargins = Rect(2,65,2,2);
DBChart1->Legend->CustomPosition = true;
DBChart1->Legend->PositionUnits =muPercent;
DBChart1->Legend->LeftPercent = 30;
DBChart1->Legend->TopPercent = 20;
DBChart2->Legend->CustomPosition = true;
DBChart2->Legend->PositionUnits =muPercent;
DBChart2->Legend->LeftPercent = 40;
DBChart2->Legend->TopPercent = 30;
DBChart3->Legend->CustomPosition = true;
DBChart3->Legend->PositionUnits =muPercent;
DBChart3->Legend->LeftPercent = 70;
DBChart3->Legend->TopPercent = 70;
ChartTool1->Shape->CustomPosition = true;
ChartTool1->PositionUnits = muPercent;
ChartTool1->Shape->Left = 30;
ChartTool1->Shape->Top = 65;
ChartTool2->Shape->CustomPosition = true;
ChartTool2->PositionUnits = muPercent;
ChartTool2->Shape->Left = 50;
ChartTool2->Shape->Top = 65;
ChartTool3->Shape->CustomPosition = true;
ChartTool3->PositionUnits = muPercent;
ChartTool3->Shape->Left = 70;
ChartTool3->Shape->Top = 45;
// add to preview
TeePreviewPanel1->Panels->Add(DBChart1);
TeePreviewPanel1->Panels->Add(DBChart2);
TeePreviewPanel1->Panels->Add(DBChart3);
}
//---------------------------------------------------------------------------
void __fastcall TForm1::SpeedButton1Click(TObject *Sender)
{
TeePreviewPanel1->Print();
}
//---------------------------------------------------------------------------
Here are my outputs:
Please give me a solution for my example.
And, at the end, another question: how can I select a chart from TeePreviewPanel in order to change at runtime the PrintMargins with the mouse? I want to see all the charts on the panel when I change the PrintMargins.
Thank you for your time
My best regards
Mihael Avram
Hi,
Sorry but I'm afraid You can't see my outputs in my last post.
Here is the image of the form with the charts and TeePreviewPanel before Print:
and here is a scan copy of the paper after Print:
As you see, on the second and third chart the legends and annotations are not printed
My best regards,
Mihael Avram
Sorry but I'm afraid You can't see my outputs in my last post.
Here is the image of the form with the charts and TeePreviewPanel before Print:
and here is a scan copy of the paper after Print:
As you see, on the second and third chart the legends and annotations are not printed
My best regards,
Mihael Avram
Problems with TeePreviewPanel Print
Please help!
I didn't received yet at answer at my problem, it's very important for my users to see on the paper exactly what they see on the screen:
Question 1. I used the component TeePreviewPanel with 2 charts. On both charts I Changed the position of the Legend (custom) in the middle of the Chart Rect. I put also some annotations on both charts. In the TeePreviewPanel, the charts are exactly like on screen, but if I print the page with TeePreviewPanel->Print(), on the listing I can’t see the Legend and the annotations on the second Chart. I am using CBuilder 5 and TeeChart 707.
I used relative positions for the Legend and Annotations, but the result is the same.
If I print like a bitmap, I can see the Legend and the annotation of both charts, but in this case the texts and graphics do not appear very well.
Question 2. I have some charts added to TeePreviewPanel. How can I select a chart at runtime from TeePreviewPanel in order to change the PrintMargins with the mouse? I want to see all the charts on the panel when I change the PrintMargins of one. If I add only a chart to TeePreviewPanel, I can change the PrintMargins, but I want to see all the charts when I change the PrintMargins of one.
My best regards,
Mihael Avram
I didn't received yet at answer at my problem, it's very important for my users to see on the paper exactly what they see on the screen:
Question 1. I used the component TeePreviewPanel with 2 charts. On both charts I Changed the position of the Legend (custom) in the middle of the Chart Rect. I put also some annotations on both charts. In the TeePreviewPanel, the charts are exactly like on screen, but if I print the page with TeePreviewPanel->Print(), on the listing I can’t see the Legend and the annotations on the second Chart. I am using CBuilder 5 and TeeChart 707.
I used relative positions for the Legend and Annotations, but the result is the same.
If I print like a bitmap, I can see the Legend and the annotation of both charts, but in this case the texts and graphics do not appear very well.
Question 2. I have some charts added to TeePreviewPanel. How can I select a chart at runtime from TeePreviewPanel in order to change the PrintMargins with the mouse? I want to see all the charts on the panel when I change the PrintMargins of one. If I add only a chart to TeePreviewPanel, I can change the PrintMargins, but I want to see all the charts when I change the PrintMargins of one.
My best regards,
Mihael Avram
Hi Mihael,
sorry for delay, I'm going to prepare an example for you, I'll send it asap.
sorry for delay, I'm going to prepare an example for you, I'll send it asap.
Pep Jorge
http://support.steema.com
http://support.steema.com
Hi Mihael,
Question 1:
well, I've been testing and it seems there's a bug printing additional panels with custom positioned objects. For the moment I've not found a good solution. We'll try to fix if for the next releases.
In meantima as a workaround you can print the page directly from metafile, this way will show all the custom objects in the paper, here is the code :
You can also create a metafile for each Chart and panit it on the Printer Canvas.
Question 2:
I've added a part of code to allow to change the margins of each Chart (panel) in the TeePreviewer, clicking over the Chart will activate the Panel margins.
Question 1:
well, I've been testing and it seems there's a bug printing additional panels with custom positioned objects. For the moment I've not found a good solution. We'll try to fix if for the next releases.
In meantima as a workaround you can print the page directly from metafile, this way will show all the custom objects in the paper, here is the code :
Code: Select all
procedure TForm1.FormCreate(Sender: TObject);
begin
Chart1.PrintProportional := false;
Chart2.PrintProportional := false;
Chart3.PrintProportional := false;
Chart1.PrintMargins := Rect(2,2,2,70);
Chart2.PrintMargins := Rect(2,35,2,35);
Chart3.PrintMargins := Rect(2,65,2,2);
Chart1.Legend.CustomPosition := true;
Chart1.Legend.PositionUnits :=muPercent;
Chart1.Legend.LeftPercent := 30;
Chart1.Legend.TopPercent := 20;
Chart2.Legend.CustomPosition := true;
Chart2.Legend.PositionUnits :=muPercent;
Chart2.Legend.LeftPercent := 40;
Chart2.Legend.TopPercent := 30;
Chart3.Legend.CustomPosition := true;
Chart3.Legend.PositionUnits :=muPercent;
Chart3.Legend.LeftPercent := 70;
Chart3.Legend.TopPercent := 70;
ChartTool1.Shape.CustomPosition := true;
ChartTool1.PositionUnits := muPercent;
ChartTool1.Shape.Left := 30;
ChartTool1.Shape.Top := 65;
ChartTool2.Shape.CustomPosition := true;
ChartTool2.PositionUnits := muPercent;
ChartTool2.Shape.Left := 50;
ChartTool2.Shape.Top := 65;
ChartTool3.Shape.CustomPosition := true;
ChartTool3.PositionUnits := muPercent;
ChartTool3.Shape.left := 70;
ChartTool3.Shape.Top := 45;
// add to preview
TeePreviewPanel1.Panels.Add(Chart1);
TeePreviewPanel1.Panels.Add(Chart2);
TeePreviewPanel1.Panels.Add(Chart3);
end;
procedure TForm1.Chart1Click(Sender: TObject);
begin
teepreviewpanel1.Panels.Clear;
TeePreviewPanel1.Panels.Add(Chart1);
TeePreviewPanel1.Panels.Add(Chart2);
TeePreviewPanel1.Panels.Add(Chart3);
TeePreviewPanel1.Repaint;
end;
procedure TForm1.Chart2Click(Sender: TObject);
begin
teepreviewpanel1.Panels.Clear;
TeePreviewPanel1.Panels.Add(Chart2);
TeePreviewPanel1.Panels.Add(Chart3);
TeePreviewPanel1.Panels.Add(Chart1);
TeePreviewPanel1.Repaint;
end;
procedure TForm1.Chart3Click(Sender: TObject);
begin
teepreviewpanel1.Panels.Clear;
TeePreviewPanel1.Panels.Add(Chart3);
TeePreviewPanel1.Panels.Add(Chart2);
TeePreviewPanel1.Panels.Add(Chart1);
TeePreviewPanel1.Repaint;
end;
procedure TForm1.BitBtn1Click(Sender: TObject);
begin
TeePreviewPanel1.Print;
end;
// Print from metafile
procedure TForm1.Button1Click(Sender: TObject);
var tmpMeta: TMetafile;
begin
with TeePreviewPanel1 do
begin
BevelOuter := bvNone;
Color:=clwhite;
Shadow.Transparency:=100;
Margins.Visible:=false;
PaperShadow.Transparency:=100;
end;
tmpMeta := TeePreviewPanel1.TeeCreateMetafile(True,TeePreviewpanel1.ClientRect);
try
// Printer.Orientation := poLandscape;
Printer.BeginDoc;
try
Printer.Canvas.StretchDraw(Rect(10,10,Printer.PageWidth - 10, Printer.PageHeight - 10),tmpMeta);
finally
Printer.EndDoc;
end;
finally
tmpMeta.Free;
end;
end;
Question 2:
I've added a part of code to allow to change the margins of each Chart (panel) in the TeePreviewer, clicking over the Chart will activate the Panel margins.
Pep Jorge
http://support.steema.com
http://support.steema.com
Problems with TeePreviewPanel
Thank you very much for the answers of both my questions.
But, if possible, and I don't abuse, I have another 2 questions:
Question 1. Could you tell me if you have an example of how could I create a metafile for each Chart and panit it on the Printer Canvas?
Question 2. In the metafile example you provided, if I print it on paper, how could I diminish the extra space around the charts, in order to maximize the information printed on the paper?. In other words, how can I configure TeePreviewpanel in order to maximize the rectangle with the charts?
Thank you in advance and Merry Christmas
Mihael Avram
But, if possible, and I don't abuse, I have another 2 questions:
Question 1. Could you tell me if you have an example of how could I create a metafile for each Chart and panit it on the Printer Canvas?
Question 2. In the metafile example you provided, if I print it on paper, how could I diminish the extra space around the charts, in order to maximize the information printed on the paper?. In other words, how can I configure TeePreviewpanel in order to maximize the rectangle with the charts?
Thank you in advance and Merry Christmas
Mihael Avram
Re: Problems with TeePreviewPanel
Here's an example that I use to do just this:Question 1. Could you tell me if you have an example of how could I create a metafile for each Chart and panit it on the Printer Canvas?
Code: Select all
procedure TForm1.AdvToolBarButton14Click(Sender: TObject);
Var
m: TMetafile;
c: TMetafileCanvas;
topc,botc: Integer;
d,k,x: integer;
begin
m := TMetafile.Create;
c := TMetafileCanvas.Create(m, 0);
d:=0;
x := 0;
topc := 2;
botc := 3;
m.enhanced := true;
tmpW:=myChart[x].Width;
tmpH:=myChart[x].Height;
for x := 0 to charts - 1 do
begin
if x = 0 then
myChart[x].DrawToMetaCanvas(c,Rect(0,0,tmpW,tmpH));
if x = 1 then
myChart[x].DrawToMetaCanvas(c,Rect(0,tmpH,tmpW,topc*tmpH));
if x >= 2 then
begin
myChart[x].DrawToMetaCanvas(c,Rect(0,topc*tmpH,tmpW,botc*tmpH));
Inc(topc);
Inc(botc);
end;
end;
try
c.Destroy;
Printer.BeginDoc;
Printer.Canvas.StretchDraw(Rect(10,50,6500,2400),m);
Printer.EndDoc;
finally
m.free;
end;
Also doing it this way, you have to use the AfterDrawEvent to draw any annotations or such to have it printed. Legends are fine unless in a custom position I believe.
HTH,
Tom
Tom
Problems with TeePreviewPanel
Hi Tom,
Thank you for the answer at my first question.
Now, I still need an answer at my question 2:
Question 2. In the metafile example provided by Josep Lluis Jorge (see the posts above), if I print it on paper, how could I diminish the extra space around the charts, in order to maximize the information printed on the paper?. In other words, how can I configure TeePreviewpanel in order to maximize the rectangle with the charts?
My best regards,
Mihael Avram
Thank you for the answer at my first question.
Now, I still need an answer at my question 2:
Question 2. In the metafile example provided by Josep Lluis Jorge (see the posts above), if I print it on paper, how could I diminish the extra space around the charts, in order to maximize the information printed on the paper?. In other words, how can I configure TeePreviewpanel in order to maximize the rectangle with the charts?
My best regards,
Mihael Avram
Re: Problems with TeePreviewPanel
The StretchToDraw is what outlines the charts onto paper. For instance, youll have to play with it a bit to get it precise to your needs. I use 11x17 paper so mine is a bit different.5887639 wrote:Hi Tom,
Thank you for the answer at my first question.
Now, I still need an answer at my question 2:
Question 2. In the metafile example provided by Josep Lluis Jorge (see the posts above), if I print it on paper, how could I diminish the extra space around the charts, in order to maximize the information printed on the paper?. In other words, how can I configure TeePreviewpanel in order to maximize the rectangle with the charts?
My best regards,
Mihael Avram
Just play with the numbers here:
Code: Select all
Printer.Canvas.StretchDraw(Rect(10,10,Printer.PageWidth - 10, Printer.PageHeight - 10),tmpMeta);
Tom
Problems with TeePreviewPanel
Hi Tom,
I'm afraid this doesn't work for me. To be more specific, I have a TeePreviewPanel where I added 3 charts. On the screen, the charts are displayed inside the panel of the component in a rectangle which is smaller than the panel. I don't know how to configure this rectangle in order to minimize the extraspace around it.
If I use this code to create a metafile:
ClientRect has the sizes of the TeePreviewPanel which are bigger than the sizes of the rectangle with the charts and because this when I print with:
on the paper the rectangle with the charts is much smaller than the paper. My problem is that I don't know how to modify the sizes of the rectangle which contins the 3 charts.
My best regards,
Mihael Avram
I'm afraid this doesn't work for me. To be more specific, I have a TeePreviewPanel where I added 3 charts. On the screen, the charts are displayed inside the panel of the component in a rectangle which is smaller than the panel. I don't know how to configure this rectangle in order to minimize the extraspace around it.
If I use this code to create a metafile:
Code: Select all
tmpMeta := TeePreviewPanel1.TeeCreateMetafile(True,TeePreviewpanel1.ClientRect);
Code: Select all
Printer.Canvas.StretchDraw(Rect(10,10,Printer.PageWidth - 10, Printer.PageHeight - 10),tmpMeta);
My best regards,
Mihael Avram
You need to set the width/height of your charts then.
Say if you have 3 charts that need to fit on the panel then loop each chart and change its height/width to match the total height/width of the panel. divide 3 by the width of the panel and that should give you the width for each chart, same with height.
Say if you have 3 charts that need to fit on the panel then loop each chart and change its height/width to match the total height/width of the panel. divide 3 by the width of the panel and that should give you the width for each chart, same with height.
Tom