對C#Chart控制項使用整理

前一篇部落格 C#char控制項的使用心得 簡述一個使用chart控制項的例子此處詳細整理一下chart控制項的使用。

要使用好Chart控制項我們先得明確它的結構。如下圖所示：(只畫出了大概結構，更多的細節會使得圖片可視性差)

1. 一個chart可以包含多個chartArea。 chartArea是具體的座標地區。

2. 每一個chartArea主要包含X軸，Y軸，副X軸(上方)，副Y軸(右方)，綁定的線條，綁定的圖例。 

3. 線條可以有許多，只要將線條綁定到chartArea就可以在對應的chartArea顯示。

其樹形實體結構如下所示： 對於每個實體裡面的許多樣式屬性可以自行嘗試研究。

綜上可以對chart的結構有一個基本瞭解。接下來結合代碼進行說明

1. 線條的建立   此處用於建立4條線段。

           public Series maxTemp;        public Series avgTemp;        public Series minTemp;        public Series vibration;

            maxTemp = new Series("maxTemp");            avgTemp = new Series("avgTemp");            minTemp = new Series("minTemp");            vibration = new Series("vibration");

2.設定線條的樣式

//曲線的顏色            maxTemp.BorderColor = Color.Black;            maxTemp.Color = Color.Red;            avgTemp.BorderColor = Color.Black;            avgTemp.Color = Color.Green;            minTemp.BorderColor = Color.Black;            minTemp.Color = Color.Blue;            vibration.BorderColor = Color.Black;            vibration.Color = Color.Blue;            //曲線的寬度            maxTemp.BorderWidth = 2;            avgTemp.BorderWidth = 2;            avgTemp.BorderWidth = 2;            vibration.BorderWidth = 2;            //曲線的樣式   有圓形曲線，階梯形曲線，折線等等。            maxTemp.ChartType = SeriesChartType.Spline;                avgTemp.ChartType = SeriesChartType.Spline;            minTemp.ChartType = SeriesChartType.Spline;            vibration.ChartType =SeriesChartType.Spline;            //曲線的陰影樣式    可以讓曲線更加突出有立體感。            maxTemp.ShadowOffset = 1;            avgTemp.ShadowOffset = 1;            minTemp.ShadowOffset = 1;            vibration.ShadowOffset = 1;            //標記的樣式        設定曲線中 每個資料點標記的樣式。可以在標記中顯示資料點的值，但是太多

//資料點的話將沒有可視性。            maxTemp.MarkerColor = Color.White;            maxTemp.MarkerStyle = MarkerStyle.Square;            avgTemp.MarkerColor = Color.White;            avgTemp.MarkerStyle = MarkerStyle.Square;            minTemp.MarkerColor = Color.White;            minTemp.MarkerStyle = MarkerStyle.Square;            vibration.MarkerColor = Color.White;            vibration.MarkerStyle = MarkerStyle.Square;            //設定線條的軸類型   主要設定以下方做X軸還是上方做X軸，左方做Y軸還是右方做Y軸            maxTemp.XAxisType = AxisType.Primary;            maxTemp.YAxisType = AxisType.Primary;            avgTemp.XAxisType = AxisType.Primary;            avgTemp.YAxisType = AxisType.Primary;            minTemp.XAxisType = AxisType.Primary;            minTemp.YAxisType = AxisType.Primary;            vibration.XAxisType = AxisType.Primary;            vibration.YAxisType = AxisType.Primary;          

            vibration.IsValueShownAsLabel = true;    //此屬性將資料點的值作為標籤。

2. ChartArea的建立和屬性設定

public ChartArea mainArea1 = new ChartArea("areaDTS");  

public ChartArea mainArea2 = new ChartArea("areaDOVS");

  //設定圖表區域 使用者可以拖動遊標   此處設定後使用者可以通過拖動遊標放大查看地區       

   //設定圖表區域 使用者可以拖動遊標            mainArea1.CursorX.IsUserEnabled = true;            mainArea1.CursorY.IsUserEnabled = true;            mainArea2.CursorX.IsUserEnabled = true;            mainArea2.CursorY.IsUserEnabled = true;

            //設定X Y 軸座標的標題。            mainArea1.AxisX.Title = "光纖分區號/(標量)";            mainArea1.AxisY.Title = "溫度值/(攝氏度)";            mainArea2.AxisX.Title = "光纖震動位置/(m)";            mainArea2.AxisY.Title = "震動值/(a.u.)";

      //設定網格。主網格 與主刻度對應 副網格與副刻度對應，從刻度向另一端畫一條線。如果線條中資料過多，

//產生較多的網格線會 使得整個地區過於密集，甚至為全黑色。所以在資料點較多的情況小關閉副網格，甚至主網格。

            mainArea1.AxisX.MajorGrid.Enabled = false;            mainArea1.AxisY.MajorGrid.Enabled = false;            mainArea1.AxisX.MinorTickMark.Enabled = false;                     mainArea2.AxisX.MajorGrid.Enabled = false;            mainArea2.AxisY.MajorGrid.Enabled = false;            mainArea2.AxisX.MinorTickMark.Enabled = false;

            //設定曲線橫座標實值型別為時間類型

            vibration.XValueType = ChartValueType.DateTime;

            //將此線條綁定到的AxisX的標籤設定時間格式。

            mainArea1.AxisX.LabelStyle.Format = "MM-dd HH:mm";     

            //設定主刻度標記和副刻度標記 一般只有主刻度標記才有對應標籤值。            mainArea1.AxisX.MinorTickMark.Enabled = true ;            mainArea1.AxisX.MajorTickMark.Enabled = true;

3. 建立圖例 標題

  Legend legend = new Legend();

 ElementPosition p = new ElementPosition(0, 0, 12, 10); 

  chart.Legends[0].Position = p;   //每建立一個對象都會存放在chart的集合屬性中可以通過數組的形式隨機訪問。

  Title title = new Title("chart使用方法");  chart.Titles.Add(title);

4.將前面建立的對象加入到自己所屬的父實體中。

 chart2.ChartAreas.Add(mainArea1);  //將線條加入到chart的chartAreas集合屬性中 chart2.ChartAreas.Add(mainArea2);

 series4.ChartArea = "areaDOVS";   //將線條綁定到對應ChartArea 通過chartArea的名字就可以綁定 series3.ChartArea = "areaDTS";

 chart2.Series.Add(series3);       //將線條加入到chart的series集合屬性中。 chart2.Series.Add(series4);

5.樣本效果。注意樣本效果與前述代碼無關，前述代碼只為了說明。

上述代碼沒有講述給線條添加資料點，前一篇部落格C#使用心得講述給線條添加資料點的方法。