TeeChart Pro VCL/FMX教程（四）：軸控制（下）

下載TeeChart Pro VCL/FMX最新版本

附加軸

複製軸

    TeeChart提供5個軸與數據系列相關聯：Left、Top、Bottom、Right和Depth。向圖表添加新系列時，您能夠定義系列應與哪些軸相關（轉到「選項卡」「General」頁面）。您可使用Axis Customdraw方法在圖表上的任何位置重複4個前軸中的任何一個（或所有）。請注意，此方法會複製Axis，但不會添加新的自定義軸。

    您將找到這個名爲「CustAxisProject1」的示例，其中包含TeeChart示例代碼：

//fill the Series for this example with random data
procedure TForm1.BitBtn1Click(Sender: TObject);
Var t:integer;
begin
  For t := 0 To 20 do
    Series1.AddXY(t, Random(100) - Random(70), '', clRed);
end;

//Put this code in the OnBeforeDrawValues() event:
procedure TForm1.Series1BeforeDrawValues(Sender: TObject);
var posaxis :Integer;
begin
  With Chart1 do
  begin
    If Axes.Left.Maximum > 0 Then
    begin
      
      //When scrolling or on zoom always keep the gridlines enclosed in the Chart rectangle
      Canvas.ClipRectangle(ChartRect);

      //Always draw the 2nd vertical Axis at the middle point of the Chart
      posaxis := (ChartRect.Left) + (ChartRect.Right - ChartRect.Left) div 2;
      Axes.Left.CustomDraw(posaxis - 10, posaxis - 20, posaxis, True);

      //Draw the 2nd Horizontal axis at the level of "10" on the vertical axis
      posaxis := (Axes.Left.CalcYPosValue(10));
      Axes.Bottom.CustomDraw(posaxis + 10, posaxis + 40, posaxis, True);

      Canvas.UnClipRectangle;
    end;
  end;
end;

自定義軸

    在此示例中，TeeChart將繪製新軸，一個水平，一個垂直位於圖表的中心。當您滾動圖表（用鼠標右鍵拖動）時，新的垂直軸將始終保持在圖表的中心，新的水平軸將垂直滾動上下移動。新軸是默認軸的精確副本。

多個自定義軸

    與PositionPercent和拉伸屬性一塊兒，能夠在圖表上的任何位置浮動無限軸。滾動，縮放和軸命中檢測也適用於自定義建立的軸。如今能夠經過圖表編輯器在設計時建立額外的軸，也能夠在運行時經過幾行代碼建立附加軸：

經過圖表編輯器

    TeeChart爲您提供在設計時建立自定義軸的功能，使其可以以TeeChart的Teechart格式保存。要實現此目的，請打開圖表編輯器並單擊「Axis」選項卡，而後選擇「+」按鈕以添加自定義軸。而後選擇位置選項卡確保您突出顯示新的自定義軸。此頁面上的“Horizontal”複選框容許您將新的自定義軸定義爲水平軸或將其保留爲默認垂直軸。如上所述，此頁面的其他部分和Axis頁面中的其餘選項卡可用於更改自定義軸的比例，增量，標題，標籤，刻度，次刻度和位置。要將此新的自定義軸與所需的數據系列相關聯，請選擇「Series」選項卡，而後轉到「General」頁面，其中下拉組合框「Horizontal Axis」和「Vertical Axis」將容許您根據先前是否認義選擇新的自定義軸它是垂直的或水平的。

經過代碼

procedure TForm1.BitBtn2Click(Sender: TObject);
Var MyAxis : TChartAxis ;
begin
  MyAxis := TChartAxis.Create(  Chart1 );
  Series2.CustomVertAxis := MyAxis;

  //You can modify any property of the new created axes, such as the axis color or axis title
  With MyAxis do
  begin
    Axis.Color:=clGreen ;
    Title.Caption := 'Extra axis' ;
    Title.Font.Style:=[fsBold];
    Title.Angle := 90;
    PositionPercent := 20; //percentage of Chart rectangle
  end;
end;

    而後，您可使用StartPosition和EndPosition屬性將新軸與圖表的總體關係定位。

StartPosition:=50;
EndPosition:=100;

    這些數字表示爲圖表矩形的百分比，其中0（零）（在垂直軸的狀況下）爲Top。這些屬性能夠應用於標準軸，以在圖表中建立徹底分區的「SubCharts」;。

 With Chart1.Axes.Left do
  begin
    StartPosition:=0;
    EndPosition:=50;
    Title.Caption:='1st Left Axis';
    Title.Font.Style:=[fsBold];
  end;

    以上2個編碼示例與如下數據結合使用：

var t: integer;
begin
  for t := 0 to 10 do
  begin
    Series1.AddXY(t,10+t,'',clTeeColor);
    if t > 1 then
      Series2.AddXY(t,t/2,'',clTeeColor);
  end;

    將顯示如下圖表：

多軸

    另外一種添加自定義軸的技術以下，使用「Axis List」做爲焦點，使用「List Add」，而後經過「Axis by Index」訪問：

//Add data to Series:
procedure TForm1.FormCreate(Sender: TObject);
begin
  Series1.FillSampleValues(10);
  Series2.FillSampleValues(10);
end;

procedure TForm1.BitBtn1Click(Sender: TObject);
var
 tmpVertAxis: TChartAxis;
 tmpHorizAxis: TChartAxis;
begin
  {Add vertical Axis}
  Chart1.CustomAxes.Add;
  tmpVertAxis:=Chart1.CustomAxes[0];
  tmpVertAxis.PositionPercent:=50;
  Series1.CustomVertAxis:=tmpVertAxis;

  {Add horizontal Axis}
  Chart1.CustomAxes.Add;
  tmpHorizAxis:=Chart1.CustomAxes[1];

  tmpHorizAxis.Horizontal:=True;
  tmpHorizAxis.Axis.Color:=clGreen;
  tmpHorizAxis.PositionPercent:=50;
  Series1.CustomHorizAxis:=tmpHorizAxis;
end;

    建議在使用自定義軸時要當心，由於很容易開始用新軸填充屏幕而且沒法跟蹤您想要管理的軸！

---

軸事件

    Axis事件提供運行時靈活性，能夠修改Axis標籤並在Axis Clicks上爲用戶提供交互性。

OnClickAxis

procedure TForm1.Chart1ClickAxis(Sender: TCustomChart; Axis: TChartAxis;
  Button: TMouseButton; Shift: TShiftState; X, Y: Integer);
begin
  //Shows Axis point clicked when click on Bottom Axis.

  if Axis = Chart1.Axes.Bottom Then
     ShowMessage('Clicked Bottom Axis at '  + FloatToStr(Chart1.Axes.Bottom.CalcPosPoint(X)));
end;

OnGetAxisLabel

procedure TForm1.Chart1GetAxisLabel(Sender: TChartAxis;
  Series: TChartSeries; ValueIndex: Integer; var LabelText: String);
begin
  if Sender = Chart1.Axes.Bottom Then
     Case StrToInt(FormatDateTime('mm', StrToDate(LabelText))) of
       1,2,3 : LabelText := '1st Qtr';
       4,5,6 : LabelText := '2nd Qtr';
     end;
end;

OnGetNextAxisLabel

procedure TForm1.Chart1GetNextAxisLabel(Sender: TChartAxis;
  LabelIndex: Integer; var LabelValue: Double; var Stop: Boolean);
begin
  Stop:=False;

  if Sender = Chart1.Axes.Bottom Then
  begin
    if LabelValue>=5 then LabelValue:=LabelValue+5
                     else LabelValue:=5;
  end
  else
    Stop:=True;

end;

    以上示例將開始在每5個點的底軸標記處標記爲'5'。其餘軸標籤不受影響。

查看Teechart.Net系列教程>>