对C#Chart控件使用整理

前一篇博客 C#char控件的使用心得 简述一个使用chart控件的例子此处详细整理一下chart控件的使用。

要使用好Chart控件我们先得明确它的结构。如下图所示：(只画出了大概结构，更多的细节会使得图片可视性差)

1. 一个chart可以包含多个chartArea。 chartArea是具体的坐标区域。

2. 每一个chartArea主要包含X轴，Y轴，副X轴(上方)，副Y轴(右方)，绑定的线条，绑定的图例。 

3. 线条可以有许多，只要将线条绑定到chartArea就可以在对应的chartArea显示。

其树形实体结构如下所示： 对于每个实体里面的许多样式属性可以自行尝试研究。

综上可以对chart的结构有一个基本了解。接下来结合代码进行说明

1. 线条的创建   此处用于创建4条线段。

[csharp] view plain copy

1.     <span style="font-size:18px;">       public Series maxTemp;  
2.         public Series avgTemp;  
3.         public Series minTemp;  
4.         public Series vibration;</span>  

[csharp] view plain copy

1. <span style="font-size:18px;">            maxTemp = new Series("maxTemp");  
2.             avgTemp = new Series("avgTemp");  
3.             minTemp = new Series("minTemp");  
4.             vibration = new Series("vibration");</span>  

2.设置线条的样式

[csharp] view plain copy

1. <span style="font-size:18px;">//曲线的颜色  
2.             maxTemp.BorderColor = Color.Black;  
3.             maxTemp.Color = Color.Red;  
4.             avgTemp.BorderColor = Color.Black;  
5.             avgTemp.Color = Color.Green;  
6.             minTemp.BorderColor = Color.Black;  
7.             minTemp.Color = Color.Blue;  
8.             vibration.BorderColor = Color.Black;  
9.             vibration.Color = Color.Blue;  
10.             //曲线的宽度  
11.             maxTemp.BorderWidth = 2;  
12.             avgTemp.BorderWidth = 2;  
13.             avgTemp.BorderWidth = 2;  
14.             vibration.BorderWidth = 2;  
15.             //曲线的样式   有圆形曲线，阶梯形曲线，折线等等。  
16.             maxTemp.ChartType = SeriesChartType.Spline;      
17.             avgTemp.ChartType = SeriesChartType.Spline;  
18.             minTemp.ChartType = SeriesChartType.Spline;  
19.             vibration.ChartType =SeriesChartType.Spline;  
20.             //曲线的阴影样式    可以让曲线更加突出有立体感。  
21.             maxTemp.ShadowOffset = 1;  
22.             avgTemp.ShadowOffset = 1;  
23.             minTemp.ShadowOffset = 1;  
24.             vibration.ShadowOffset = 1;  
25.             //标记的样式        设置曲线中 每个数据点标记的样式。可以在标记中显示数据点的值，但是太多</span>  

[csharp] view plain copy

1. <span style="font-size:18px;">//数据点的话将没有可视性。  
2.             maxTemp.MarkerColor = Color.White;  
3.             maxTemp.MarkerStyle = MarkerStyle.Square;  
4.             avgTemp.MarkerColor = Color.White;  
5.             avgTemp.MarkerStyle = MarkerStyle.Square;  
6.             minTemp.MarkerColor = Color.White;  
7.             minTemp.MarkerStyle = MarkerStyle.Square;  
8.             vibration.MarkerColor = Color.White;  
9.             vibration.MarkerStyle = MarkerStyle.Square;  
10.             //设置线条的轴类型   主要设置以下方做X轴还是上方做X轴，左方做Y轴还是右方做Y轴  
11.             maxTemp.XAxisType = AxisType.Primary;  
12.             maxTemp.YAxisType = AxisType.Primary;  
13.             avgTemp.XAxisType = AxisType.Primary;  
14.             avgTemp.YAxisType = AxisType.Primary;  
15.             minTemp.XAxisType = AxisType.Primary;  
16.             minTemp.YAxisType = AxisType.Primary;  
17.             vibration.XAxisType = AxisType.Primary;  
18.             vibration.YAxisType = AxisType.Primary;       </span>     

[csharp] view plain copy

1.   

[csharp] view plain copy

1. vibration.IsValueShownAsLabel = true;    //此属性将数据点的值作为标签。  

2. ChartArea的创建和属性设置

[csharp] view plain copy

1.   

[csharp] view plain copy

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

[csharp] view plain copy

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

[csharp] view plain copy

1. //设置图表区域 用户可以拖动游标   此处设置后用户可以通过拖动游标放大查看区域         

[csharp] view plain copy

1.   

[csharp] view plain copy

1. //设置图表区域 用户可以拖动游标  
2.          mainArea1.CursorX.IsUserEnabled = true;  
3.          mainArea1.CursorY.IsUserEnabled = true;  
4.          mainArea2.CursorX.IsUserEnabled = true;  
5.          mainArea2.CursorY.IsUserEnabled = true;  

[csharp] view plain copy

1. //设置X Y 轴坐标的标题。  
2. mainArea1.AxisX.Title = "光纤分区号/(标量)";  
3. mainArea1.AxisY.Title = "温度值/(摄氏度)";  
4. mainArea2.AxisX.Title = "光纤震动位置/(m)";  
5. mainArea2.AxisY.Title = "震动值/(a.u.)";  

[csharp] view plain copy

1. //设置网格。主网格 与主刻度对应 副网格与副刻度对应，从刻度向另一端画一条线。如果线条中数据过多，  

[csharp] view plain copy

1. //产生较多的网格线会 使得整个区域过于密集，甚至为全黑色。所以在数据点较多的情况小关闭副网格，甚至主网格。  

[csharp] view plain copy

1. mainArea1.AxisX.MajorGrid.Enabled = false;  
2. mainArea1.AxisY.MajorGrid.Enabled = false;  
3. mainArea1.AxisX.MinorTickMark.Enabled = false;  
4.   
5. mainArea2.AxisX.MajorGrid.Enabled = false;  
6. mainArea2.AxisY.MajorGrid.Enabled = false;  
7. mainArea2.AxisX.MinorTickMark.Enabled = false;  

[csharp] view plain copy

1.   

[html] view plain copy

1.   

[html] view plain copy

1. //设置曲线横坐标值类型为时间类型  

[html] view plain copy

1. vibration.XValueType = ChartValueType.DateTime;  

[html] view plain copy

1. //将此线条绑定到的AxisX的标签设置时间格式。  

[csharp] view plain copy

1.   

[csharp] view plain copy

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

[csharp] view plain copy

1. //设置主刻度线和副刻度线 一般只有主刻度线才有对应标签值。  
2. mainArea1.AxisX.MinorTickMark.Enabled = true ;  
3. mainArea1.AxisX.MajorTickMark.Enabled = true;  

3. 创建图例 标题

[csharp] view plain copy

1. Legend legend = new Legend();  

[csharp] view plain copy

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

[csharp] view plain copy

1.   

[csharp] view plain copy

1. chart.Legends[0].Position = p;   //每创建一个对象都会存放在chart的集合属性中可以通过数组的形式随机访问。  

[csharp] view plain copy

1.   

[csharp] view plain copy

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

[csharp] view plain copy

1.   

[csharp] view plain copy

1. 4.将前面创建的对象加入到自己所属的父实体中。  

[csharp] view plain copy

1. chart2.ChartAreas.Add(mainArea1);  //将线条加入到chart的chartAreas集合属性中  
2. chart2.ChartAreas.Add(mainArea2);  

[csharp] view plain copy

1. series4.ChartArea = "areaDOVS";   //将线条绑定到对应ChartArea 通过chartArea的名字就可以绑定  
2. series3.ChartArea = "areaDTS";  

[csharp] view plain copy

1. chart2.Series.Add(series3);       //将线条加入到chart的series集合属性中。  
2. chart2.Series.Add(series4);  

5.示例效果。注意示例效果与前述代码无关，前述代码只为了说明。

[csharp] view plain copy

1.   

[csharp] view plain copy

1. 上述代码没有讲述给线条添加数据点，前一篇博客C#使用心得讲述给线条添加数据点的方法。