[ASP.NET] MS Chart(3) DataBindCrossTable
在上篇是將資料分拆為XY軸,並不是直接連結資料表
作法有點瑣碎,剛好後來看到這個還有這種方式進行資料連結 還蠻便利的。
用法:DataBindCrossTable(資料庫連接,要群組的欄位名,X軸欄位,Y軸欄位,標註在圖表點上的文字欄位)
中間的設定我就省略了,使用...帶過。
private void CreateMultipleChart(DataTable dt)
{
if (dt.Rows.Count > 0)
{
pnlShowChart.Controls.Clear();
Chart Charttmp = new Chart();
Charttmp.ChartAreas.Add("crtArea"); //圖表區域集合
Charttmp.Legends.Add("lg"); //圖例集合
//設定 Chart 大小
Charttmp.Width = 800;
Charttmp.Height = 400;
Title title = new Title();
title.Text = "圖表範例"; //標題
title.Alignment = ContentAlignment.MiddleCenter;
title.Font = new System.Drawing.Font("細明體", 14F, FontStyle.Bold);
Charttmp.Titles.Add(title);
...
...
//資料繫結
DataTableReader dtr = dt.CreateDataReader();
Charttmp.DataBindCrossTable(dtr, "theyear","themonth", "people", "Label=people");
foreach (Series ser in Charttmp.Series)
{
ser.MarkerSize = 8; //Label 範圍大小
//字體設定
ser.Font = new System.Drawing.Font("細明體", 10, System.Drawing.FontStyle.Bold);
//Label 背景色
ser.LabelBackColor = Color.FromArgb(240, 245, 245, 245);
...
...
}
pnlShowChart.Controls.Add(Charttmp);
}
}
畫面呈現
這是圖表讀取的資料
PerMonth |
people |
theyear |
themonth |
1996-07 |
20 |
1996 |
7 |
1996-08 |
18 |
1996 |
8 |
1996-09 |
19 |
1996 |
9 |
1996-10 |
20 |
1996 |
10 |
1996-11 |
21 |
1996 |
11 |
1996-12 |
25 |
1996 |
12 |
1997-07 |
25 |
1997 |
7 |
1997-08 |
30 |
1997 |
8 |
1997-09 |
27 |
1997 |
9 |
1997-10 |
28 |
1997 |
10 |
1997-11 |
27 |
1997 |
11 |
1997-12 |
37 |
1997 |
12 |
範例檔案 下載