DevExpress圖表控件XtraCharts在監控軟件中的應用

張國梁

（西藏民族學院網絡信息技術中心,陜西 咸陽 712082）

1.概述

DevExpress是一流的控件套包產品。它功能強大，是.NET基礎控件擴展包，可以快速開發出專業、強大的應用程序。其中的XtraCharts組件可以方便、快捷的開發出有關二維和三維圖表軟件。該組件可使用在窗口應用、ASP.NET和打印頁面上。XtraCharts可以可視化各種數據，包括數據庫表和集合數據。XtraCharts的二維圖表包括柱狀圖、點圖、線圖、餅圖等，同時還支持三維圖。

一般的監控軟件，都需要采集監控對象的各項數據，并動態顯示各項數據變化。如果直接從底層做會比較復雜，而且要達到專業性的顯示效果更難。但是，如果使用XtraCharts來實現，可以極大提高開發效率和效果。開發人員不必耗費太多時間在圖表顯示上，而將重點放在數據的處理上。

2.XtraCharts應用方法和實例分析

ChartControl控件是將XtraCharts用在WinForm上。本文主要論述ChartControl控件應用。XtraCharts在ASP.NET和打印頁面上應用方法和此類似。DevExrpress為用戶提供兩種方式使用該控件：一是可以將ChartControl直接拖放在窗口上，通過Chart Wizard來定制具體的應用；二是在程序運行時，直接通過代碼來生成定制具體的應用。第一種方式簡單方便，適合簡單應用。第二種方法比較復雜，但靈活，適合復雜應用。本文主要介紹第二種方式。

ChartControl將要顯示的數據和對應圖形分離。該控件將每一組相關的數據封裝在一個series對象中。其中一個series對象代表了一系列相關的數據點，作為在圖表上顯示的一個分組。同一個series對象可以不同的視覺方式表示。比如同一組數據可以分別使用柱狀圖、點圖、線圖、餅圖等表示。Chart-Control中的Diagram對象用來表示圖表的顯示布景，包括Axis坐標軸，Gridline網格線，圖例Legend等。

下面根據實例來分析ChartControl應用方法。例如，如果需要開發有關監控病人體征的軟件，在微機上實現病人體征動態顯示和監控，則需要在圖表上同時顯示多項數據動態變化圖。假設要監控病人的體征：包括體溫、呼吸和脈搏值三項數據。這三項數據都可以看作為是以某一時間點為自變量的函數的值。時間點之間有固定時間間隔。因此，可以設計讓三項數據共用一個時間軸，用X軸表示，同時這三項數據又分別對應一個Y軸。三項數據分別對應三個series對象。

3.實現方法和步驟

3.1 設置Diagram對象

自定義一個類來實現。用來設定圖表顯示元素，包括坐標軸和圖例等。坐標軸分為主坐標軸和副坐標軸。需要將不同類型數據顯示在同一張圖表上，而每一項數據的數值有不同范圍。因此就需要多個坐標軸表示這每一項數據，每一種數據封裝在一個series對象中。因此每一個坐標軸和一個series對象綁定。在本文應用中，將采集數據的時間作為X軸，在Y軸方向分別為每一個時間點上對應的體溫、呼吸和脈搏值。因此需要設定一個X軸和三個Y軸。其中一個為主Y軸呼吸數據綁定，兩個副Y軸分別同體溫數據和脈搏數據綁定。使用下面的代碼來實現一個表示體溫的副Y軸。

上面提到過Diagram對象用來設置圖表上的顯示元素。因此，首先定義Diagram對象。再將副軸加入到Diagram對象上。

private XYDiagram xyDiagram1;

xyDiagram1.SecondaryAxesY.AddRange(new SecondaryA-xisY[]

{secondaryAxisY1,secondaryAxisY2});

SecondaryAxisY secondaryAxisY1=new SecondaryAxisY();//定義一個副Y軸。

secondaryAxisY1.Alignment=AxisAlignment.Near;//設定顯示位置。

secondaryAxisY1.GridSpacingAuto=false;//網格線間隔手動設置。

secondaryAxisY1.GridSpacing=2;//設置網格線的間隔。

secondaryAxisY1.Range.MaxValueSerializable="42";//顯示體溫的最大值。

secondaryAxisY1.Range.MinValueSerializable="20";//顯示體溫的最小值。

secondaryAxisY1.Range.Auto=false;

secondaryAxisY1.Range.SideMarginsEnabled=true;

secondaryAxisY1.NumericOptions.Format= DevExpress.XtraCharts.NumericFormat.Number;

secondaryAxisY1.NumericOptions.Precision=1;

secondaryAxisY1.Name="secondaryAxisY1";

最后再用XYDiagram對象xyDiagram1設定ChartControl對象中，Diagram屬性。

lineChart.Diagram=xyDiagram1;

3.2 定義Series對象

每一個Series對象綁定一項數據和一個Y軸。下面代碼，定義Series對象ser1，顯示類型為Spline，表示樣條曲線。并且和上面定義的secondaryAxisY1綁定。

Series ser1=new Series(“體溫”,ViewType.Spline);

ser1.ArgumentScaleType=ScaleType.DateTime;//自變量類型為日期時間型。

((LineSeriesView)ser1.View).LineMarkerOptions.Kind =MarkerKind.Triangle;//設置ser1對應的圖例。

((LineSeriesView)ser1.View).LineStyle.DashStyle=Dash-Style.Solid;

((LineSeriesView)ser1.View).Color=Color.Red;

((LineSeriesView)ser1.View).LineMarkerOptions.Size=10;

((LineSeriesView)ser1.View).LineStyle.Thickness=1;

ser1.PointOptions.ArgumentDateTimeOptions.Format=Date-TimeFormat.ShortTime;

ser1.SeriesPointsSorting=SortingMode.Ascending;

下面定義樣條曲線視圖SplineSeriesView對象spline-SeriesView1。設定其對應的坐標軸為secondaryAxisY1。再用splineSeriesView1設置ser1的View屬性。

SplineSeriesView splineSeriesView1=new SplineSeriesView();

splineSeriesView1.AxisYName="secondaryAxisY1";

ser1.View=splineSeriesView1;

最后將ser1加到圖表上。代碼為：

lineChart.Series.Add(ser1);//lineChart為ChartControl對象。

3.3 向Series對象上添加數據

當數據可以動態更新時，相應的曲線也會變化，從而實現動態曲線。定義定時器，在定時器事件中加數據點。代碼如下，pointTime為時間點，dd為對應的值。

private void timer1_Tick(object sender,EventArgs e)

{

ser1.Points.Add(new SeriesPoint(pointTime,new double[]{dd}));

pointTime=pointTime.AddMinutes(5);

}

3.4 實現圖表自動滾屏

當數據不斷增加，在圖表上顯示完一屏時，就需要自動滾屏。具體的做法是，定時修改X軸的表示范圍。當代碼如下：

xyDiagram1.AxisX.Range.Auto=false;

xyDiagram1.AxisX.Range.MaxValue=start;//設置X軸的起點

xyDiagram1.AxisX.Range.MinValue=end;//設置X軸的終點。

當X軸的表示范圍變化時，顯示的曲線隨之移動，從而實現圖表的滾屏。

4.應用效果分析

通過以上的方法和步驟，就可以使用DevExpress來實現較為復雜的圖表功能，在一個圖表顯示多種不同的數據，將這些不同數據和指定坐標軸綁定，并實現圖表的動態更新和自動滾屏。實現效果如圖1病人體征監測圖所示。圖1中顯示了三項數據的變化趨勢，并包含一個X軸和三個Y軸，圖中上部為X軸表示時間，右側從左到右依次分別為副Y軸2、副Y軸1和主Y軸。體溫對應紅色線和副Y軸1，圖例為三角形。呼吸對應紫色線和副Y軸2，圖例為正方形。呼吸對應褐色線和主Y軸，圖例為圓形。

圖1 病人體征監測圖

本文中使用的開發環境：VS2008 C#，DevExpress控件包V8.2。示例軟件運行環境：.netframework2.0，windows xp/windows2003/windows7。

5.結語

在本文中，通過監控軟件的應用實例，介紹了DevExpress圖表控件的使用方法和步驟。從中可以看出，使用DevExpress中XtraChart組件來開發圖表相關軟件，既可以實現比較復雜的功能，又可以達到比較好的顯示效果。同時開發人員不必耗費太多精力在圖表顯示上，而將重點放在數據的處理上，從而可以提高開發效率和效果。

[1]DevExpress Documentation.

[2]http：//documentation.devexpress.com/#XPO/CustomDocument-1998.

[3]Christian Nagel.C#高級編程[M].清華大學書版社.2006.

[4]李福紅.DevExpres表格控件運行時動態設置表格列[J].中國高新技術企業，2010，33：117.