利用Chart控件對學生信息進行統(tǒng)計，最終結果如下：

?

Chart圖形控件主要由以下幾個部份組成：

1.Annotations --圖形注解集合
2.ChartAreas? --圖表區(qū)域集合
3.Legends????? --圖例集合
4.Series　　??--圖表序列集合（即圖表數(shù)據(jù)對象集合）
5.Titles　　　--圖標的標題集合

Annotations :

Annotations是一個對圖形的一些注解對象的集合，所謂注解對象，類似于對某個點的詳細或者批注的說明，比如，在圖片上實現(xiàn)各個節(jié)點的關鍵信息，如下圖方框和黃色的小方框：

一個圖形上可以擁有多個注解對象，可以添加十多種圖形樣式的注解對象，包括常見的箭頭、云朵、矩行、圖片等等注解符號，通過各個注解對象的屬性，可以方便的設置注解對象的放置位置、呈現(xiàn)的顏色、大小、文字內(nèi)容樣式等常見的屬性。

ChartAreas:

ChartAreas是一個Chart的繪圖區(qū)，如果要在一個Chart控件上顯示多張不同的圖，則建立多個不同的ChartArea。

chartPie.ChartAreas.Add("ChartArea1"); chartPie.ChartAreas.Add("ChartArea2");

chartPie.ChartAreas.Add("ChartArea3");

對于每一個ChartArea，可以設置其x,y軸的屬性： columnChart.ChartAreas["ChartArea1"].AxisX.Title = "年齡"; columnChart.ChartAreas["ChartArea1"].AxisX.TextOrientation = TextOrientation.Horizontal; columnChart.ChartAreas["ChartArea1"].AxisX.TitleAlignment = StringAlignment.Far;//命名空間System.Drawing

　//lineChart.ChartAreas["ChartArea1"].AxisY.Maximum = 1;//設置Y軸最大值
　lineChart.ChartAreas["ChartArea1"].AxisX.Minimum = min;//是在Y軸最小值
　lineChart.ChartAreas["ChartArea1"].AxisX.Maximum = 100;
　lineChart.ChartAreas["ChartArea1"].AxisX.Interval = 5;//設置每個刻度的跨度

開啟3D效果:

lineChart.ChartAreas["ChartArea1"].Area3DStyle.Enable3D = true;

Legends:

　　legends是一個圖例的集合，可以看成是對圖中數(shù)據(jù)集合的注解，當數(shù)據(jù)較多時利用legend可分清數(shù)據(jù)指代：

?

　　

chartPie.Legends.Add("Legend1");//實現(xiàn)圖標注解

Series：

　　圖表序列，應該是整個繪圖中最關鍵的內(nèi)容了，通俗點說，即是實際的繪圖數(shù)據(jù)區(qū)域，實際呈現(xiàn)的圖形形狀，就是由此集合中的每一個圖表來構成的，可以往集合里面添加多個圖表，每一個圖表可以有自己的繪制形狀、樣式、獨立的數(shù)據(jù)。

　　需要注意的是，每一個圖表，你可以指定它的繪制區(qū)域（見ChartAreas的說明），讓此圖表呈現(xiàn)在某個繪圖區(qū)域，也可以讓幾個圖表在同一個繪圖區(qū)域疊加，如下圖：

?

　　上面兩幅圖，分別表示了把多個Series放在不同的ChartAreas和放在同一個ChartArea的情況。

　　添加數(shù)據(jù)進series：

第一種：

string[] xValues = { "male", "female" }; int[] yValues = { male, female }; chartPie.Series["Pie"].Points.DataBindXY(xValues, yValues); chartPie.Series["Pie"]["PieLabelStyle"] = "Inside";

第二種：

lineChart.Series["Series1"].Points.AddXY(XVaule,YValues);

餅狀圖中實現(xiàn)某一塊分離：

chartPie.Series["Pie"].Points[1]["Exploded"] = "true";

?

Titles：

圖表的標題:

Title t = new Title("灰常好", Docking.Top, new System.Drawing.Font("Trebuchet MS", 14, System.Drawing.FontStyle.Bold), System.Drawing.Color.FromArgb(26, 59, 105)); lineChart.Titles.Add(t);

其他屬性：

1.ToolTip：

　　當鼠標放在圖形上顯示信息。

columnChart.Series["Column"].ToolTip = "人數(shù)：#VAL";

2.Border：

chartPie.BorderSkin.SkinStyle = BorderSkinStyle.Emboss; chartPie.BorderlineColor = System.Drawing.Color.FromArgb(26, 59, 105);
chartPie.BorderlineDashStyle = ChartDashStyle.Solid; chartPie.BorderlineWidth = 2;

3.Label：

　　Label即標簽的含義，可以在圖片的關鍵位置進行一些關鍵數(shù)字或文字的描述，如下圖：

　　像上圖：X軸和Y軸的文字便是標簽，以及圖表曲線中的紅點上的文字，也是標簽，添加了標簽，可以讓人更容易的對內(nèi)容進行理解。

?

chart還有許多類型：

如果你想用那個下面為你提供了一個選擇。

?	成員名稱	說明
?	Point	點圖類型。
?	FastPoint	快速點圖類型。
?	Bubble	氣泡圖類型。
?	Line	折線圖類型。
?	Spline	樣條圖類型。
?	StepLine	階梯線圖類型。
?	FastLine	快速掃描線圖類型。
?	Bar	條形圖類型。
?	StackedBar	堆積條形圖類型。
?	StackedBar100	百分比堆積條形圖類型。
?	Column	柱形圖類型。
?	StackedColumn	堆積柱形圖類型。
?	StackedColumn100	百分比堆積柱形圖類型。
?	Area	面積圖類型。
?	SplineArea	樣條面積圖類型。
?	StackedArea	堆積面積圖類型。
?	StackedArea100	百分比堆積面積圖類型。
?	Pie	餅圖類型。
?	Doughnut	圓環(huán)圖類型。
?	Stock	股價圖類型。
?	Candlestick	K?線圖類型。
?	Range	范圍圖類型。
?	SplineRange	樣條范圍圖類型。
?	RangeBar	范圍條形圖類型。
?	RangeColumn	范圍柱形圖類型。
?	Radar	雷達圖類型。
?	Polar	極坐標圖類型。
?	ErrorBar	誤差條形圖類型。
?	BoxPlot	盒須圖類型。
?	Renko	磚形圖類型。
?	ThreeLineBreak	新三值圖類型。
?	Kagi	卡吉圖類型。
?	PointAndFigure	點數(shù)圖類型。
?	Funnel	漏斗圖類型。
?	Pyramid	棱錐圖類型。

?

Click Event：

當點擊餅狀圖或柱狀圖中的某一部分數(shù)據(jù)時，將彈出Gridview顯示對應索引的數(shù)據(jù)：

protected void chartPie_Click(object sender, ImageMapEventArgs e){GridView1.Visible = true;string[] input = e.PostBackValue.Split(':');if (input.Length == 2)//PAGE_LOAD里面?zhèn)鞯亩€參數(shù),Series名字和索引 {string[] seriesData = input[1].Split(',');Series s = this.chartPie.Series[seriesData[0]];//獲取點擊的Series,Series集合命名空間：using System.Web.UI.DataVisualization.Charting;//string m = s.Points[int.Parse(seriesData[1])].XValue.ToString();string m = seriesData[1].ToString();string sql = "select * from users where Sex = '" + m + "'";DataTable dt = DBHelper.GetDataSet(sql);GridView1.DataSource = dt;GridView1.DataBind();}}

在Page_Load里加如下代碼：

this.chartPie.Click += new ImageMapEventHandler(chartPie_Click); foreach (Series series in this.chartPie.Series){series.PostBackValue = "Column:" + series.Name + ",#VALX";}

頁首第三個圖的代碼：

?

using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data.SqlClient; using System.Data; using System.Web.UI.DataVisualization.Charting;public partial class chartLine : System.Web.UI.Page {protected void Page_Load(object sender, EventArgs e){string sql = "select * from users";Dictionary<double, int> chinese = new Dictionary<double, int>();Dictionary<double, int> math = new Dictionary<double, int>();Dictionary<double, int> english = new Dictionary<double, int>();SqlDataReader dr = DBHelper.GetReader(sql);while (dr.Read()){if (chinese.ContainsKey(Convert.ToDouble(dr["chinese"]))){chinese[Convert.ToDouble(dr["chinese"])]++;}else{chinese.Add(Convert.ToDouble(dr["chinese"]), 1);}if (math.ContainsKey(Convert.ToDouble(dr["math"]))){math[Convert.ToDouble(dr["math"])]++;}else{math.Add(Convert.ToDouble(dr["math"]), 1);}if (english.ContainsKey(Convert.ToDouble(dr["english"]))){english[Convert.ToDouble(dr["english"])]++;}else{english.Add(Convert.ToDouble(dr["english"]), 1);}}dr.Close();bool flag = false;int min = 0;int i = 0;for (i =0; i < 100; i++){if (chinese.ContainsKey(Convert.ToDouble(i))){lineChart.Series["Chinese"].Points.AddXY(Convert.ToDouble(i),chinese[Convert.ToDouble(i)]);flag = true;}if (math.ContainsKey(Convert.ToDouble(i))){lineChart.Series["Math"].Points.AddXY(Convert.ToDouble(i), math[Convert.ToDouble(i)]);flag = true;}if (english.ContainsKey(Convert.ToDouble(i))){lineChart.Series["English"].Points.AddXY(Convert.ToDouble(i), english[Convert.ToDouble(i)]);flag = true;}if (!flag){min = i;}}//lineChart.ChartAreas["ChartArea1"].AxisY.Maximum = 1;//設置Y軸最大值lineChart.ChartAreas["ChartArea1"].AxisX.Minimum = min;//是在Y軸最小值lineChart.ChartAreas["ChartArea1"].AxisX.Maximum = 100;lineChart.ChartAreas["ChartArea1"].AxisX.Interval = 5;//設置每個刻度的跨度 lineChart.Legends.Add("Legend1");lineChart.ChartAreas["ChartArea1"].Area3DStyle.Enable3D = true;//給圖表添加標題Title title = new Title();title.Text = "學生成績分析表";lineChart.Titles.Add(title);//修改圖例名稱lineChart.Series["Chinese"].LegendText = "語文";lineChart.Series["Math"].LegendText = "數(shù)學";lineChart.Series["English"].LegendText = "英語";//設置每個數(shù)據(jù)點標簽顯示在圖表上lineChart.Series["Math"].Label = "#VAL";//為每個數(shù)據(jù)點添加提示信息，同PreRender函數(shù)lineChart.Series["Math"].ToolTip = "#VALX" + "," + "#VAL";}protected void lineChart_PreRender(object sender, EventArgs e){//為每個點添加提示信息for (int i = 0; i < lineChart.Series["Chinese"].Points.Count; i++){lineChart.Series["Chinese"].Points[i].ToolTip = "#VAL" + "," + "#VALX";}} }

?

學習中大致參考以下鏈接：

Chart基本介紹

http://blog.csdn.net/lzq7419/article/details/7693491

Chart的多種用法

http://blog.csdn.net/freeman127/article/details/4437268

http://blog.csdn.net/freeman127/article/details/4437461

Chart屬性介紹

http://blog.csdn.net/zfyong/article/details/6049566

轉(zhuǎn)載于:https://www.cnblogs.com/yyx3254/p/3706812.html

總結

以上是生活随笔為你收集整理的MS Chart 学习心得的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。