TeeChart Pro VCL/FMX教程（十一）：縮放和滾動(dòng)

    TeeChart Pro VCL/FMX是一款主流的圖表制作工具。提供了數(shù)百種用于可視化的2D、3D圖形樣式、56種數(shù)學(xué)、統(tǒng)計(jì)和金融函數(shù)，以及不限數(shù)量的坐標(biāo)軸和30種調(diào)色板組件。TeeChart Pro VCL/FMX教程將會(huì)以連載的形式持續(xù)為大家?guī)鞹eeChart Pro VCL/FMX的使用方法。 

點(diǎn)擊下載TeeChart Pro VCL/FMX最新試用版 

  本篇教程為大家?guī)淼氖?a target="_self" style="white-space: normal; color: rgb(31, 73, 125);">TeeChart Pro VCL/FMX中縮放和滾動(dòng)的這一節(jié)，縮放和滾動(dòng)在關(guān)注人口稠密圖表中的特定數(shù)據(jù)時(shí)是非常有用的輔助工具，內(nèi)容主要分為以下幾個(gè)部分： 

1. 如何使用鼠標(biāo)進(jìn)行縮放和滾動(dòng)

   縮放

   滾動(dòng)

2. 如何通過代碼縮放和滾動(dòng)
   

   縮放

   動(dòng)畫縮放

   縮放事件

   滾動(dòng)

如何使用鼠標(biāo)進(jìn)行縮放和滾動(dòng)

縮放

    要縮放圖表，請?jiān)谝s放的區(qū)域的左上角按鼠標(biāo)右鍵，將矩形拖動(dòng)到縮放區(qū)域的右下角。釋放鼠標(biāo)按鈕將強(qiáng)制圖表重繪所選區(qū)域。

    要撤消縮放，請在圖表區(qū)域的任意位置按鼠標(biāo)左鍵，然后按住鼠標(biāo)按鈕向上和向左拖動(dòng)。釋放按鈕，圖表將強(qiáng)制重繪為最初定義的圖表區(qū)域。

滾動(dòng)

    要滾動(dòng)圖表，請按住鼠標(biāo)左鍵，將鼠標(biāo)拖動(dòng)到您想要滾動(dòng)圖表的方向。釋放鼠標(biāo)按鈕時(shí)，圖表將保留在新位置。

    要撤消滾動(dòng)，請?jiān)?圖表區(qū)域的任意位置按鼠標(biāo)左鍵，然后按住鼠標(biāo)按鈕向上和向左拖動(dòng)。釋放按鈕，圖表將強(qiáng)制重繪為最初定義的圖表區(qū)域。

如何通過代碼縮放和滾動(dòng)

縮放

    默認(rèn)情況下，啟用縮放。使用AllowZoom屬性禁用縮放，定義要縮放的矩形區(qū)域，請使用ZoomRect方法：

Rect.Left  := LineSeries1.CalcXPosValue( 22.5  ) ;
Rect.Top   := LineSeries1.CalcYPosValue( 5000 ) ;
Rect.Right := LineSeries1.CalcXPosValue( 57.6 ) ;
Rect.Bottom:= LineSeries1.CalcYPosValue( 15000 ) ;
Chart1.ZoomRect( Rect );

   ZoomRect坐標(biāo)以屏幕像素定義，其中0,0是圖表面板的左上角。以下代碼將放大第2和第5個(gè)x軸點(diǎn)之間的區(qū)域，將y軸設(shè)置為整個(gè)圖表的最大和最小點(diǎn)的比例：

With Chart1 do
begin
  ZoomRect(Rect(Axes.Bottom.CalcXPosValue(2),                       
              	Axes.Bottom.CalcXPosValue(5),
              	Axes.Left.CalcYPosValue(MaxYValue(Axes.Left)), 
              	Axes.Left.CalcYPosValue(MinYValue(Axes.Left))));
end;

    使用撤消縮小。

Chart1.UndoZoom;

動(dòng)畫縮放

    動(dòng)畫縮放提供步進(jìn)縮放。您可以將AnimatedZoom設(shè)置為啟用并為縮放交錯(cuò)步驟，而不是一步步的從縮小到放大。 啟用AnimatedZoom后，您可以使用鼠標(biāo)或代碼手動(dòng)縮放。

With Chart1 do
begin
  AnimatedZoom := True;
  AnimatedZoomSteps := 10;
  ZoomRect(Rect(Axes.Bottom.CalcXPosValue(2),                                     Axes.Left.CalcYPosValue(MaxYValue(Axes.Left)),
             Axes.Bottom.CalcXPosValue(5),
             Axes.Left.CalcYPosValue(MinYValue(Axes.Left))));
end;

縮放事件

    手動(dòng)或按代碼放大將觸發(fā)Chart.OnZoom事件，縮小將觸發(fā)Chart.UndoZoom事件。

滾動(dòng)

    默認(rèn)情況下，為所有方向啟用滾動(dòng)。使用AllowPanning屬性禁用滾動(dòng)或?qū)L動(dòng)限制為一個(gè)方向。 您需要定義Axis最大值和最小值以便按代碼滾動(dòng)。

With Chart1 do
begin
  AllowPanning := pmHorizontal; //permit manual scrolling horizontally only.
  Axes.Bottom.Automatic := False;
  Axes.Bottom.Minimum := 2;
  Axes.Bottom.Maximum := 5;
end;

    您可以使用滾動(dòng)條更改軸最小值和最大值，從而完全按代碼控制滾動(dòng)，TeeChart Pro包含一個(gè)ScrollBar組件，可以使過程更容易。

    ScrollBar組件：使用TChartScrollBar將滾動(dòng)條添加到圖表，TChartScrollBar可以連接到任何Axis，您應(yīng)該使用Kind屬性將ScrollBar定義為垂直或水平，使用Align屬性來選擇Axis。

    手動(dòng)代碼：

With Chart1 do
  AllowPanning := pmHorizontal; //permit manual scrolling horizontally only.
  Axes.Bottom.Automatic := False;
  //limit display to 5 points onscreen 
  ChartScrollBar1.Chart := Chart1;
  ChartScrollBar1.Kind := sbHorizontal;
  ChartScrollBar1.Min := 0;
  ChartScrollBar1.Max := 20;
End With

    本篇教程就介紹到這里，對以上內(nèi)容有任何疑惑或者建議都可以在下方評論留言，TeeChart Pro VCL/FMX教程會(huì)持續(xù)更新，可以多多關(guān)注。

    TeeChart for .NET，TeeChart for JavaScript/HTML5，TeeChart for Xamarin.Android均已加入在線訂購，現(xiàn)在搶購可立享特別優(yōu)惠！??！

    關(guān)注慧聚IT微信公眾號(hào)???，了解產(chǎn)品的最新動(dòng)態(tài)及最新資訊。