【分享】asp.net WebChart 折线图、饼形图、柱状图
折线图形的数据库设计：
id int
name varchar(50)
dataTime datetime
饼形图和柱状图使用同一个表的数据：
id int
name varchar(50)
shuliang int
下面的ChartControl1、ChartControl2、ChartControl3都是从工具箱拖进页面的webChart控件的ID
1、折线图代码：(实现的为当年的按月份的趋势)
定义颜色：
1
2
3 private string[] myColor = new string[]
4
5 {
6
7 "Tomato",//西红柿
8
9 "Black",
10
11 "Gold",
12
13 "Blue",
14
15 "Green",
16
17 "Orange",
18
19 "Pink",//粉红
20
21 "Violet",//紫罗兰
22
23 "Orchid",//淡紫色
24
25 "Lime",//亮绿
26
27 "Tan",//茶色
28
29 "Red",
30
31 "Navy"//橘红
32
33 };
给webChart绑定数据：
1 private void GetLineChart()
2
3 {
4
5 //创建折线对象
6
7 LineChart myLineChart = new LineChart();
8
9 myLineChart.Line.Color = Color.FromName(myColor[0]);
10
11 myLineChart.Fill.Color = Color.FromName(myColor[0]);
12
13 myLineChart.LineMarker = new DiamondLineMarker(8,Color.FromName(myColor[0]),Color.FromName(myColor[0]));
14
15 myLineChart.DataSource = GetData().DefaultView;//GetData()方法见下
16
17 myLineChart.DataXValueField = "mMonth";
18
19 myLineChart.DataYValueField = "count";
20
21 myLineChart.DataLabels.Visible = true;
22
23 myLineChart.Legend = "2011年";
24
25 myLineChart.DataBind();
26
27 //myLineChart.Data.Add(new ChartPoint("一",float.Parse("20"))); 此注释部分为添加静态数据
28
29 //myLineChart.Data.Add(new ChartPoint("二",float.Parse("40")));
30
31 //myLineChart.Data.Add(new ChartPoint("3", float.Parse("50")));
32
33 //myLineChart.Data.Add(new ChartPoint("4", float.Parse("30")));
34
35 //this.ChartControl1.YCustomEnd = 60;
36
37 //this.ChartControl1.YValuesInterval = 10;
38
39 this.ChartControl1.Charts.Add(myLineChart);
40
41 this.ChartControl1.RedrawChart();
42
43 }
44
45
46
47
48
49 private DataTable GetData()
50
51 {
52
53 Class1 c = new Class1();
54
55 string sql = "select * from(SELECT 1 AS 'mMonth'UNION SELECT 2 AS 'mMonth'UNION SELECT 3 AS 'mMonth'UNION SELECT 4 AS 'mMonth'UNION SELECT 5 AS 'mMonth'UNION SELECT 6 AS 'mMonth'UNION SELECT 7 AS 'mMonth'UNION SELECT 8 AS 'mMonth'UNION SELECT 9 AS 'mMonth' UNION SELECT 10 AS 'mMonth'UNION SELECT 11 AS 'mMonth'UNION SELECT 12 AS 'mMonth') as m left join(select count(dataTime) as [count],month(dataTime) as monthTime from lineChart where year(dataTime)=DATEPART(year, getDate()) group By month(dataTime)) b on m.mMonth = b.monthTime";
56
57 //此处的sql语句有点……
58
59 SqlCommand cmd = new SqlCommand(sql, c.Conn);
60
61 DataSet ds = new DataSet();
62
63 SqlDataAdapter da = new SqlDataAdapter(cmd);
64
65 da.Fill(ds);
66
67 DataTable dt = ds.Tables[0];
68
69 return dt;
70
71 }
2、柱状图的代码：
1 private void bindchart()
2
3 {
4
5 DataTable dt = this.getdt();//getdt()方法见下
6
7 if (dt != null)
8
9 {
10
11 if (dt.Rows.Count > 0)
12
13 {
14
15 //遍历DataTable为每条记录生成一个柱状
16
17 for (int i = 0; i < dt.Rows.Count; i++)
18
19 {
20
21 //创建对象
22
23 ColumnChart mychart = new ColumnChart();
24
25 //设置柱子宽度
26
27 mychart.MaxColumnWidth = 24;
28
29 //颜色
30
31 mychart.Fill.Color = Color.FromName(this.myColor[i]);
32
33 //在柱子上显示数量
34
35 mychart.DataLabels.Visible = true;
36
37 //数量的字体
38
39 mychart.DataLabels.Font = new Font("Verdana", 14);
40
41 //dt.Rows[i]["name"].ToString()
42
43 //添加
44
45 mychart.Data.Add(new ChartPoint("",float.Parse(dt.Rows[i]["shuliang"].ToString())));
46
47 //备注
48
49 mychart.Legend = dt.Rows[i]["name"].ToString();
50
51
52
53 this.ChartControl2.Charts.Add(mychart);
54
55 }
56
57 //辅助设置
58
59 //背景色
60
61 ChartControl2.Background.Color = Color.FromArgb(165, 0, 16);
62
63 ChartControl2.YAxisFont.ForeColor = Color.FromArgb(165, 0, 16);
64
65 ChartControl2.XAxisFont.ForeColor = Color.FromArgb(165, 0, 16);
66
67 //内部线条
68
69 ChartControl2.Border.Color = Color.FromArgb(200, 200, 200);
70
71 //边框样式
72
73 ChartControl2.BorderStyle = BorderStyle.None;
74
75 //y最大值
76
77 double max = double.Parse(dt.Compute("MAX(shuliang)", "").ToString());
78
79 //递增值
80
81 int intv = 2;
82
83
84
85 //数量小于16的情况
86
87 if (max < 16)
88
89 {
90
91 max = 16;
92
93 }
94
95 //大于16的情况
96
97 else
98
99 {
100
101 int intintv = int.Parse(Math.Ceiling(max / 8).ToString());
102
103 max += intv;
104
105 }
106
107
108
109 //设置Y轴终点值
110
111 //ChartControl2.YCustomEnd = int.Parse(max.ToString());
112
113 ChartControl2.YCustomEnd = 50;
114
115 //y递增值
116
117 ChartControl2.YValuesInterval = 5;
118
119
120
121 //生成
122
123 this.ChartControl2.RedrawChart();
124
125 }
126
127 }
128
129 }
130
131
132
133
134
135 private DataTable getdt()
136
137 {
138
139 Class1 c = new Class1();
140
141 string sql = "select * from chart";
142
143 SqlCommand cmd = new SqlCommand(sql,c.Conn);
144
145 DataSet ds = new DataSet();
146
147 SqlDataAdapter da = new SqlDataAdapter(cmd);
148
149 da.Fill(ds);
150
151 DataTable dt = ds.Tables[0];
152
153 return dt;
154
155 }
156
157
3、饼状图的代码：
1 private void GetPieChart()
2
3 {
4
5 PieChart c = new PieChart();
6
7 c.DataSource = getdt().DefaultView;//getdt()方法与柱状图为同一个
8
9 c.DataXValueField = "name";
10
11 c.DataYValueField = "shuliang";
12
13 c.Shadow.Visible = true;
14
15 c.DataLabels.ForeColor = System.Drawing.Color.Blue;
16
17 //c.Colors = new Color[] { Color.Red, Color.Blue, Color.Yellow, Color.Cyan, Color.AntiqueWhite, Color.RosyBrown };
18
19 c.DataLabels.Visible = true;
20
21 ChartControl1.Background.EndPoint = new Point(500, 350);
22
23 c.Explosion = 1;
24
25 c.DataBind();
26
27 ChartControl3.Charts.Add(c);
28
29 ChartControl3.RedrawChart();
30
31 }
32
33
34
35
36
37 private DataTable getdt()
38
39 {
40
41 Class1 c = new Class1();
42
43 string sql = "select * from chart";
44
45 SqlCommand cmd = new SqlCommand(sql,c.Conn);
46
47 DataSet ds = new DataSet();
48
49 SqlDataAdapter da = new SqlDataAdapter(cmd);
50
51 da.Fill(ds);
52
53 DataTable dt = ds.Tables[0];
54
55 return dt;
56
57 }
来自: http://hi.baidu.com/shenhui%5F1/blog/item/e1214f631cfbae31aa184c80.html
