Teechart圖表應用技術詳解—第二章之Teechart組件的應用實例：圖表編輯器

    Steema是全球領先的圖表類控件公司，總部設在西班牙的巴塞羅那附近，Steema公司的VCL圖表報表控件在全球擁有極高知名度。Steema公司和慧都科技針對中國市場聯合推出中文版TeeChart for .NET圖表控件，一經推出，就在市場上大受歡迎，如果有感興趣的用戶，可以下載試用版體驗一下。

點擊下載TeeChart for .NET最新試用版    

Teechart組件的應用實例

    Steema為了充分發揮TeeChart頁圖表組件的功能，將圖表編輯器的選項卡進行了拆分，構成獨立的可視或非可視組件，由程序設計員根據用戶的功能要求進行重新組合，以滿足用戶需要。

圖表編輯器

    演示： ChartEditor，ChartEditorPanel組件。

    功能：演示圖表編輯器ChartEditorPanel和ChartEditor在程序設計階段和運行階段的使用方法，實現對圖表的在線式手動編輯。

    設計：

1. ChartEditor、 ChartEditorPanel組件是圖表編輯器以不同的表現形式呈現其功能。

2. 窗口左下角放置的是ChartEditorPanell組件，在設計階段其外觀是以Panel形式顯示的，僅當程序運行后才顯示其實際界面，屬可視組件。窗口的 ChartEditor是非可視組件，在命令按鈕“調用圖表編輯器”中調用。窗口右下角放置的是ChartEditorPanel2組件，在窗體的 OnCreate事件中加入下列代碼是其按樹型狀態顯示：

   ChartEditorPanel2.Editor.Tree.Visible:=true

3. 三個組件都可以實現對窗口中間的圖表組件 Chart1進行編輯，只是采用ChartEditorPanel1和 ChartEditorPane2組件時總是顯示在屏幕上，采用ChartEditor組件則可以在需要時調用。

4. 上述兩個組件的Chart屬性設置為Chart1，否則不能正確顯示。也可在Form的OnCreate事件中加入下列代碼：

   ChartEditor1.Chart:Chart1;
   ChartEditorPanel.Chart:Chart1;
   Series1.FillSampleValues(10);
   Series2.FillSampleValues(10);

5. 為在運行期間調用圖表編輯器，在按鈕Button1的Onclick事件中加入代碼：

   ChartEditor1.Execute;

6. 為改變圖表編輯器的Tabs位置，在ComboBox1的 OnChange事件中加入以下代碼：

var
p:TTabPosition;
begin
case ComboBox1.ItemIndex of
0:p:=tptop;
1:p:=tpBottom;
2:p:=tpLeft;
3:p:=tpRight;
end;
ChartEditorPanel1.Editor.TabGeneral.PageControl.TabPosition:=p;
end;

    設置：如下表所示。

    技巧：

1. 本例除演示兩個圖表編輯器的功能外，還提供了根據鼠標在圖表上的單擊位置，自動顯示圖表編輯器相應編輯頁面等功能。將會在第7章圖表的打印與導出部分介紹。

2. 樹形模式。圖表編輯器可以被顯示成“樹形模式”，使用一個左對齊的樹形視圖控件來作為多個編輯器對話框的主管理器，代碼如下：

ChartEditor1.Treeview= True;
ChartEditor1.Execute;

    界面：程序運行后的界面圖1所示。

    下一節我們將會介紹Teechart組件的應用實例：數據柵格和導航。將會有演示，功能，設計，設置，技巧和界面六個方面的介紹。如果有對Teechart圖表感興趣的朋友，可以多多關注本教程，并且歡迎在評論區留言。

相關資料推薦：

上一章：Teechart頁面上的組件概述

Teechart 2019資源合集

Teechart 2018資源合集 

    現TeeChart for .NET，TeeChart for JavaScript/HTML5，TeeChart for Xamarin.Android等均已加入在線訂購，現在搶購可立享優惠！

    關注慧聚IT微信公眾號???，了解產品的最新動態及最新資訊。