ASP.NET页面中实现数据柱状图

棒图有时又称为"Bar"图，在ASP.NET中拥有了一个新功能--绘图功能，通过此功能就能够按照要实现的图表的模样来绘制，最后在客户端的浏览器中形成一个图片，从而显示出图表来。

　　本文就是介绍在ASP.NET页面中实现Bar图的具体方法。希望本篇文章能够让您领会到ASP.NET中强大的绘图功能，而我们知道图表只有在和数据库关联以后，才能够显示出更强大的优势。下面就来介绍在ASP.NET页面中从数据库中提起数据，并以此数据形成Bar图的具体实现方法。

　一．本文程序设计和运行的软件环境：

　　（1）.微软公司视窗2000服务器版。

　　（2）.Visual Studio .Net正式版，.Net FrameWork SDK版本号3705。

　　（3）.MDAC 2.6（Microsoft Data Acess Component）以上版本。

　　二．建立数据源

　　为了方便起见，本文选择的数据库类型为本地数据库--Access 2000，如果你使用的是其他数据库类型，只需对下面介绍的程序中的关于数据库连接的代码进行相应的修改就可以了。Access数据库名称为"db2.mdb"，在此数据库中只定义了一张数据表"MonthSale"，此表的结构如表01所示：

字段名称	类型	说明
ID	自动编号	主键，递增
YF	数字	销售月份
SL	数字	销量

　　　　　　　　　表01：MonthSale数据表的结构

　　在定义完"db2.mdb"数据库中的"MonthSale"数据表后，在MonthSale数据表中按照表02所示添加记录： 

ID	YF	SL
1	1	12
2	2	5
3	3	7
4	4	20
5	5	16
6	6	10
7	7	19
8	8	8
9	9	7
10	10	13
11	11	11
12	12	15

　　　　　　表02：Table01数据表中的记录情况

　　在MonthSale数据表中添加完这12条记录后，保存"db2.mdb"数据库到C盘的根目录中。
三．ASP.NET页面中实现数据Bar图的关键步骤及其实现方法：

　　在ASP.NET页面中实现数据Bar图首先必须解决二大问题：

　　（1）.首先要解决在ASP.NET页面中实现数据库连接和从数据库中读取数据的方法。

　　程序要实现从数据库中一条条的读取数据，则要使用OleDbDataReader类，OleDbDataReader类提供了从数据库中逐条读取数据的方法。下面代码是连接C盘根目录下的"db2.mdb"数据库，逐条读取MonthSale数据表中的记录，并把数据存放到定义的二个数组中：

 1string sRouter = "c:\\db2.mdb" ;
 2            //获得当前Access数据库在服务器端的绝对路径
 3
 4            string strCon = " Provider = Microsoft.Jet.OLEDB.4.0; Data Source = " + sRouter ;
 5            //创建一个数据库连接
 6
 7            OleDbConnection myConn = new OleDbConnection ( strCon ) ;
 8            string strCom = " SELECT YF ,SL FROM MonthSale ORDER BY YF" ;
 9            myConn.Open ( ) ;
10            OleDbCommand myCommand = new OleDbCommand ( strCom , myConn ) ;
11            OleDbDataReader myOleDbDataReader = myCommand.ExecuteReader ( ) ;
12            //创建OleDbDataReader实例，并以此实例来获取数据库中各条记录数据
13
14            int [ ] iXiaoSH = new int [ 12 ] ;
15            //定义一个数组，用以存放从数据库中读取的销售数据
16
17            string [ ] sMoth = new string [ 12 ] ;
18            //定义一个数组，用以存放从数据库中读取的销售月份
19
20            int iIndex = 0 ;
21            while ( myOleDbDataReader.Read ( ) ) 
22            {
23                iXiaoSH [ iIndex ] = myOleDbDataReader.GetInt32 ( 1 ) ;
24                sMoth [ iIndex ] = myOleDbDataReader.GetInt32 ( 0 ) . ToString ( ) + "月" ;
25                iIndex++ ;
26            }
27            //读取Table01数据表中的各条数据，并存放在先前定义的二个数组中
28
29            myConn . Close ( ) ;
30            myOleDbDataReader . Close ( ) ;
31            //关闭各种资源

（2）.根据得到数据，绘制图片，并显示出来：

　　通过第一步，已经把从数据库中的读取的数据存放到"iXiaoSH"和"sMoth"数组中。下面就要解决依据这些数据绘制出Bar图？首先先了解一下在ASP.NET页面中将要实现的数据Bar图的模样。具体可如图01所示：

图01：在ASP.NET中实现的数据Bar图

　　程序中把图01所示各个元素，按照区域分成了五个部分，这五个部分将在后面介绍的程序中分别实现：

　　1. 构建整个图片

　　首先要创建一Bitmap实例，并以此来构建一个Graphics实例，Graphics实例提供了各种绘制方法，这样才能按照数据的要求在Bitmap实例上绘制各种图形。下面代码是在ASP.NET中创建Bitmap实例，并以此实例来构建 Graphics实例的具体方法：

1Bitmap bm = new Bitmap ( 600 , 250 ) ;
2            //创建一个长度为600，宽带为250的Bitmap实例
3
4            Graphics g ;
5            g = Graphics.FromImage ( bm ) ;
6            //由此Bitmap实例创建Graphic实例
7
8            g . Clear ( Color.Snow) ;
9            //用Snow色彩为背景色填充此绘画图面

2. 图01中的标题部分文字：

　　这是通过Graphics实例中提供的DrawString方法以指定的字体、颜色、在指定的位置绘制指定的字符串。下面代码的作用是绘制图01中标题：

1g . DrawString ( " ××公司××××年度销售情况统计表" , new Font ( "黑体" , 16 ) , Brushes . Black , new Point ( 5 , 5 ) ) ;
2            //在绘画图面的指定位置，以指定的字体、指定的颜色绘制指定的字符串。即为图表标题
3

3. 图01