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

27 None.gif             // 读取Table01数据表中的各条数据,并存放在先前定义的二个数组中
28 None.gif
29 None.gif            myConn . Close ( ) ;
30 None.gif            myOleDbDataReader . Close ( ) ;
31 None.gif             // 关闭各种资源

(2).根据得到数据,绘制图片,并显示出来:

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

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

  1. 构建整个图片

  首先要创建一Bitmap实例,并以此来构建一个Graphics实例,Graphics实例提供了各种绘制方法,这样才能按照数据的要求在Bitmap实例上绘制各种图形。下面代码是在ASP.NET中创建Bitmap实例,并以此实例来构建 Graphics实例的具体方法:
1 None.gif Bitmap bm  =   new  Bitmap (  600  ,  250  ) ;
2 None.gif             // 创建一个长度为600,宽带为250的Bitmap实例
3 None.gif
4 None.gif            Graphics g ;
5 None.gif            g  =  Graphics.FromImage ( bm ) ;
6 None.gif             // 由此Bitmap实例创建Graphic实例
7 None.gif
8 None.gif            g . Clear ( Color.Snow) ;
9 None.gif             // 用Snow色彩为背景色填充此绘画图面
2. 图01中的标题部分文字:

  这是通过Graphics实例中提供的DrawString方法以指定的字体、颜色、在指定的位置绘制指定的字符串。下面代码的作用是绘制图01中标题:
1 None.gif g . DrawString (  "  ××公司××××年度销售情况统计表 "  ,  new  Font (  " 黑体 "  ,  16  ) , Brushes . Black ,  new  Point (  5  ,  5  ) ) ;
2 None.gif             // 在绘画图面的指定位置,以指定的字体、指定的颜色绘制指定的字符串。即为图表标题
3 None.gif
3. 图01中的提示区域,即图01中的右上角显示的内容:

  要绘制这部分内容首先要定位,可以把这部分要绘制的内容分成三个小部分:

  其一,是图01中的"单位:万套"文字,这部分处理起来比较简单,当选定要在图片中输出的文字坐标后,调用Graphics实例中提供的DrawString方法就可以了;
  
  其二,是绘制图01中的小方块,首先要调用Graphics实例中的DrawRectangle方法在指定位置,以指定的颜色,绘制指定大小的方块,然后再条约Graphics实例中的FillRectangle填充这个小方块就完成了;

  其三,是绘制小方块右边的文字。同样要使用Graphics实例中提供的DrawString方法,只不过位置坐标和字体要进行相应改变罢了。下面代码功能是绘制图01右上角显示的内容:
 1 None.gif // 以下代码是是实现图右上部
 2 None.gif             Point myRec  =   new  Point (  535  ,  30  ) ;
 3 None.gif            Point myDec  =   new  Point (  560  ,  26  ) ;
 4 None.gif
 5 None.gif             // 以上是在图01中为下面绘制定位
 6 None.gif             g . DrawString (  " 单位:万套 "  ,  new  Font (  " 宋体 "  ,  9  ) , Brushes . Black ,  new  Point (  525  ,  12  ) ) ;
 7 None.gif   
 8 None.gif   
 9 None.gif             for  (  int  i  =   0  ; i  <  sMoth.Length ; i ++  ) 
10 ExpandedBlockStart.gifContractedBlock.gif             dot.gif {
11InBlock.gif                g . DrawRectangle ( Pens.Black , myRec . X , myRec . Y , 20 , 10 ) ;
12InBlock.gif                //绘制小方块
13InBlock.gif
14InBlock.gif                g . FillRectangle ( new SolidBrush ( GetColor ( i ) ) , myRec.X , myRec.Y , 20 , 10 ) ;
15InBlock.gif                //填充小方块
16InBlock.gif
17InBlock.gif                g . DrawString ( sMoth [ i ] . ToString ( ) , new Font ( "宋体" , 9 ) , Brushes . Black , myDec ) ;
18InBlock.gif                //绘制小方块右边的文字
19InBlock.gif
20InBlock.gif                myRec . Y += 15 ;
21InBlock.gif                myDec . Y += 15 ;
22ExpandedBlockEnd.gif            }


4. 根据从数据库中读取的数据,绘制数据Bar图:

  此部分与第三部分比较类似,最主要的区别在于,绘制的位置不相同,下面代码是在图01中绘制数据Bar图,并提示Bar图所代表的数量:

 

 1 None.gif // 以下代码是绘制Bar图,及其销售数量
 2 None.gif              int  iBarWidth  =   40  ;
 3 None.gif             int  scale  =   10  ;
 4 None.gif             for  (  int  i  =   0  ; i  <  iXiaoSH . Length ; i ++  ) 
 5 ExpandedBlockStart.gifContractedBlock.gif             dot.gif {
 6InBlock.gif                g . DrawRectangle ( Pens.Black, ( i * iBarWidth ) + 15 , 250 - ( iXiaoSH [ i ] * scale ) , 20 , ( iXiaoSH [ i ] * scale ) + 5 ) ;
 7InBlock.gif                //绘制Bar图
 8InBlock.gif
 9InBlock.gif                g . FillRectangle ( new SolidBrush (GetColor ( i )) , ( i * iBarWidth ) + 15 , 250 - ( iXiaoSH [ i ] * scale ) , 20 , ( iXiaoSH [ i ] * scale ) + 5 ) ;
10InBlock.gif                //以指定的色彩填充Bar图
11InBlock.gif
12InBlock.gif                g . DrawString ( iXiaoSH [ i ] . ToString ( ) , new Font ( "宋体" , 9 ) , Brushes . Black , ( i * iBarWidth ) + 20 , 235 - ( iXiaoSH [ i ] * scale ) ) ;
13InBlock.gif                //显示Bar图代表的数据
14ExpandedBlockEnd.gif            }
5. 绘制图片边框,并形成Jpeg文件格式在客户端显示:

  绘制图片边框,使用的Graphics实例中的DrawRectangle方法。至于采用Jpeg格式文件在客户端显示,是因为Jpeg文件占用的空间较小,利于网络传送。下面代码是绘制图01中的边框,并形成Jpeg文件:
1 None.gif // 以下代码是绘制边框,并形成Jpeg文件,供浏览器显示出来
2 None.gif             Pen p  =   new  Pen ( Color.Black ,  2  ) ;
3 None.gif            g . DrawRectangle ( p ,  1  ,  1  ,  598  ,  248  ) ;
4 None.gif            bm.Save ( Response . OutputStream , ImageFormat.Gif) ;

四.ASP.NET页面中实现数据Bar图实现步骤:

  掌握了上面的关键步骤及其解决方法后,在ASP.NET实现数据Bar相对就容易许多了,下面是ASP.NET页面中实现数据Bar图的具体实现步骤,在开发工具上选用的是Visual Stuido .Net企业构建版,采用的开发语言是C#。

  1. 启动Visual Studio .Net

  2. 选择菜单【文件】|【新建】|【项目】后,弹出【新建项目】对话框

  3. 将【项目类型】设置为【Visual C#项目】

  4. 将【模板】设置为【ASP.NET Web 应用程序】

  5. 在【位置】的文本框中输入"http://localhost/Bar"。然后单击【确定】按钮,这样在Visual Studio .Net就会在当前项目文件所在目录中建立一个名称为"WebBarDemo"文件夹,里面存放是此项目的项目文件,项目中的其他文件存放的位置是计算机Internet信息服务的默认的Web站点所在的目录中新建的一个名称为"WebBarDemo"的文件夹中。具体如图02所示:
newPro.JPG
 图02:新建一个ASP.NET项目对话框

  6. 把Visual Studio .Net的当前窗口切换到WebForm的代码编辑窗口,即:WebForm1.aspx.cs文件的编辑窗口。

  7. 在WebForm1.aspx.cs文件首部,用下列代码替换WebForm1.aspx.cs中导入命名空间的代码
1 None.gif // 下面程序中使用的ImageFormat类所在的命名空间
2 None.gif using  System.Drawing.Imaging;
3 None.gif // 下面程序中使用到关于数据库方面的类所在的命名空间
4 None.gif using  System.Data.OleDb;
 8. WebForm1.aspx.cs文件中的Page_Load事件处理代码中添加下列代码,下列代码的作用是打开数据库,读取数据,并以此数据形成数据Bar图:

 1 None.gif private   void  Page_Load( object  sender, System.EventArgs e)
 2 ExpandedBlockStart.gifContractedBlock.gif         dot.gif {
 3InBlock.gif            // 在此处放置用户代码以初始化页面
 4InBlock.gif
 5InBlock.gif            string sRouter = "c:\\db2.mdb" ;
 6InBlock.gif            //获得当前Access数据库在服务器端的绝对路径
 7InBlock.gif
 8InBlock.gif            string strCon = " Provider = Microsoft.Jet.OLEDB.4.0; Data Source = " + sRouter ;
 9InBlock.gif            //创建一个数据库连接
10InBlock.gif
11InBlock.gif            OleDbConnection myConn = new OleDbConnection ( strCon ) ;
12InBlock.gif            string strCom = " SELECT YF ,SL FROM MonthSale ORDER BY YF" ;
13InBlock.gif            myConn.Open ( ) ;
14InBlock.gif            OleDbCommand myCommand = new OleDbCommand ( strCom , myConn ) ;
15InBlock.gif            OleDbDataReader myOleDbDataReader = myCommand.ExecuteReader ( ) ;
16InBlock.gif            //创建OleDbDataReader实例,并以此实例来获取数据库中各条记录数据
17InBlock.gif
18InBlock.gif            int [ ] iXiaoSH = new int [ 12 ] ;
19InBlock.gif            //定义一个数组,用以存放从数据库中读取的销售数据
20InBlock.gif
21InBlock.gif            string [ ] sMoth = new string [ 12 ] ;
22InBlock.gif            //定义一个数组,用以存放从数据库中读取的销售月份
23InBlock.gif
24InBlock.gif            int iIndex = 0 ;
25InBlock.gif            while ( myOleDbDataReader.Read ( ) ) 
26ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
27InBlock.gif                iXiaoSH [ iIndex ] = myOleDbDataReader.GetInt32 ( 1 ) ;
28InBlock.gif                sMoth [ iIndex ] = myOleDbDataReader.GetInt32 ( 0 ) . ToString ( ) + "" ;
29InBlock.gif                iIndex++ ;
30ExpandedSubBlockEnd.gif            }

31InBlock.gif            //读取Table01数据表中的各条数据,并存放在先前定义的二个数组中
32InBlock.gif
33InBlock.gif            myConn . Close ( ) ;
34InBlock.gif            myOleDbDataReader . Close ( ) ;
35InBlock.gif            //关闭各种资源
36InBlock.gif
37InBlock.gif            Bitmap bm = new Bitmap ( 600 , 250 ) ;
38InBlock.gif            //创建一个长度为600,宽带为250的Bitmap实例
39InBlock.gif
40InBlock.gif            Graphics g ;
41InBlock.gif            g = Graphics.FromImage ( bm ) ;
42InBlock.gif            //由此Bitmap实例创建Graphic实例
43InBlock.gif
44InBlock.gif            g . Clear ( Color.Snow) ;
45InBlock.gif            //用Snow色彩为背景色填充此绘画图面
46InBlock.gif
47InBlock.gif            g . DrawString ( " ××公司××××年度销售情况统计表" , new Font ( "黑体" , 16 ) , Brushes . Black , new Point ( 5 , 5 ) ) ;
48InBlock.gif            //在绘画图面的指定位置,以指定的字体、指定的颜色绘制指定的字符串。即为图表标题
49InBlock.gif
50InBlock.gif            //以下代码是是实现图右上部
51InBlock.gif            Point myRec = new Point ( 535 , 30 ) ;
52InBlock.gif            Point myDec = new Point ( 560 , 26 ) ;
53InBlock.gif
54InBlock.gif            //以上是在图01中为下面绘制定位
55InBlock.gif            g . DrawString ( "单位:万套" , new Font ( "宋体" , 9 ) , Brushes . Black , new Point ( 525 , 12 ) ) ;
56InBlock.gif   
57InBlock.gif   
58InBlock.gif            for ( int i = 0 ; i < sMoth.Length ; i++ ) 
59ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
60InBlock.gif                g . DrawRectangle ( Pens.Black , myRec . X , myRec . Y , 20 , 10 ) ;
61InBlock.gif                //绘制小方块
62InBlock.gif
63InBlock.gif                g . FillRectangle ( new SolidBrush ( GetColor ( i ) ) , myRec.X , myRec.Y , 20 , 10 ) ;
64InBlock.gif                //填充小方块
65InBlock.gif
66InBlock.gif                g . DrawString ( sMoth [ i ] . ToString ( ) , new Font ( "宋体" , 9 ) , Brushes . Black , myDec ) ;
67InBlock.gif                //绘制小方块右边的文字
68InBlock.gif
69InBlock.gif                myRec . Y += 15 ;
70InBlock.gif                myDec . Y += 15 ;
71ExpandedSubBlockEnd.gif            }

72InBlock.gif
73InBlock.gif            //以下代码是绘制Bar图,及其销售数量
74InBlock.gif            int iBarWidth = 40 ;
75InBlock.gif            int scale = 10 ;
76InBlock.gif            for ( int i = 0 ; i < iXiaoSH . Length ; i++ ) 
77ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
78InBlock.gif                g . DrawRectangle ( Pens.Black, ( i * iBarWidth ) + 15 , 250 - ( iXiaoSH [ i ] * scale ) , 20 , ( iXiaoSH [ i ] * scale ) + 5 ) ;
79InBlock.gif                //绘制Bar图
80InBlock.gif
81InBlock.gif                g . FillRectangle ( new SolidBrush (GetColor ( i )) , ( i * iBarWidth ) + 15 , 250 - ( iXiaoSH [ i ] * scale ) , 20 , ( iXiaoSH [ i ] * scale ) + 5 ) ;
82InBlock.gif                //以指定的色彩填充Bar图
83InBlock.gif
84InBlock.gif                g . DrawString ( iXiaoSH [ i ] . ToString ( ) , new Font ( "宋体" , 9 ) , Brushes . Black , ( i * iBarWidth ) + 20 , 235 - ( iXiaoSH [ i ] * scale ) ) ;
85InBlock.gif                //显示Bar图代表的数据
86ExpandedSubBlockEnd.gif            }

87InBlock.gif
88InBlock.gif            //以下代码是绘制边框,并形成Jpeg文件,供浏览器显示出来
89InBlock.gif            Pen p = new Pen ( Color.Black , 2 ) ;
90InBlock.gif            g . DrawRectangle ( p , 1 , 1 , 598 , 248 ) ;
91InBlock.gif            bm.Save ( Response . OutputStream , ImageFormat.Gif) ;
92ExpandedBlockEnd.gif        }

9. WebForm1.aspx.cs文件中的InitializeComponent过程之后,添加下列代码,下列代码的作用是定义一个名称为GetColor函数,此函数的功能根据索引号得到相应的系统颜色:
 1 ExpandedBlockStart.gif ContractedBlock.gif /**/ /// <summary>
 2InBlock.gif        /// 获取颜色
 3InBlock.gif        /// </summary>
 4InBlock.gif        /// <param name="itemIndex">数组的索引</param>
 5ExpandedBlockEnd.gif        /// <returns></returns>

 6 None.gif          private  Color GetColor (  int  itemIndex ) 
 7 ExpandedBlockStart.gifContractedBlock.gif         dot.gif {
 8InBlock.gif             Color MyColor ;
 9InBlock.gif             int i = itemIndex ;
10InBlock.gif            switch (i) 
11ExpandedSubBlockStart.gifContractedSubBlock.gif             dot.gif{
12InBlock.gif                  case 0 :
13InBlock.gif                   MyColor = Color.Green;
14InBlock.gif                   return MyColor;
15InBlock.gif                  case 1 :
16InBlock.gif                   MyColor = Color.Red;
17InBlock.gif                    return MyColor;
18InBlock.gif                  case 2:
19InBlock.gif                   MyColor = Color.Yellow;
20InBlock.gif                   return MyColor;
21InBlock.gif                  case 3 :
22InBlock.gif                   MyColor = Color.Blue;
23InBlock.gif                   return MyColor;
24InBlock.gif                  case 4 :
25InBlock.gif                   MyColor = Color.Orange;
26InBlock.gif                   return MyColor;
27InBlock.gif                 case 5 :
28InBlock.gif                   MyColor = Color.Aqua;
29InBlock.gif                   return MyColor;
30InBlock.gif                  case 6:
31InBlock.gif                   MyColor = Color.SkyBlue;
32InBlock.gif                   return MyColor;
33InBlock.gif                  case 7:
34InBlock.gif                   MyColor = Color.DeepPink;
35InBlock.gif                   return MyColor;
36InBlock.gif                  case 8:
37InBlock.gif                   MyColor = Color.Azure;
38InBlock.gif                   return MyColor;
39InBlock.gif                  case 9:
40InBlock.gif                   MyColor = Color.Brown;
41InBlock.gif                   return MyColor;
42InBlock.gif                  case 10:
43InBlock.gif                   MyColor = Color.Pink;
44InBlock.gif                   return MyColor;
45InBlock.gif                  case 11:
46InBlock.gif                   MyColor = Color.BurlyWood;
47InBlock.gif                   return MyColor;
48InBlock.gif                  case 12:
49InBlock.gif                   MyColor = Color.Chartreuse;
50InBlock.gif                   return MyColor;
51InBlock.gif                  default:
52InBlock.gif                   MyColor = Color.Pink;
53InBlock.gif                   return MyColor;
54ExpandedSubBlockEnd.gif            }

55ExpandedBlockEnd.gif        }

10. 至此,在上述步骤都正确执行后,在ASP.NET页面中实现数据Bar图的全部工作就完成了。在确定上面建立的Access数据库"db.mdb"位于C盘的根目录中之后,单击快捷键F5,就可以得到如图01所示的数据Bar图了。

  五.总结:

  在ASP.NET页面中实现各种图表,其所使用的就是ASP.NET的绘图功能,而这一功能是ASP.NET的前一个版本所不具备的。上面的这些介绍,不仅介绍了在ASP.NET绘制各种图片的方法,还介绍了数据库连接和从数据库中逐条读取记录的方法。这些方法对您了解和掌握在ASP.NET中操作数据库是非常有用的。

完整的例子程序:
  1 None.gif using  System;
  2 None.gif using  System.Collections;
  3 None.gif using  System.ComponentModel;
  4 None.gif using  System.Data;
  5 None.gif using  System.Drawing;
  6 None.gif using  System.Web;
  7 None.gif using  System.Web.SessionState;
  8 None.gif using  System.Web.UI;
  9 None.gif using  System.Web.UI.WebControls;
 10 None.gif using  System.Web.UI.HtmlControls;
 11 None.gif
 12 None.gif // 下面程序中使用的ImageFormat类所在的命名空间
 13 None.gif using  System.Drawing.Imaging;
 14 None.gif // 下面程序中使用到关于数据库方面的类所在的命名空间
 15 None.gif using  System.Data.OleDb;
 16 None.gif
 17 None.gif namespace  WebBarDemo
 18 ExpandedBlockStart.gifContractedBlock.gif dot.gif {
 19ExpandedSubBlockStart.gifContractedSubBlock.gif    /**//// <summary>
 20InBlock.gif    /// WebForm1 的摘要说明。
 21ExpandedSubBlockEnd.gif    /// </summary>

 22InBlock.gif    public class WebForm1 : System.Web.UI.Page
 23ExpandedSubBlockStart.gifContractedSubBlock.gif    dot.gif{
 24InBlock.gif        private void Page_Load(object sender, System.EventArgs e)
 25ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
 26InBlock.gif            // 在此处放置用户代码以初始化页面
 27InBlock.gif
 28InBlock.gif            string sRouter = "c:\\db2.mdb" ;
 29InBlock.gif            //获得当前Access数据库在服务器端的绝对路径
 30InBlock.gif
 31InBlock.gif            string strCon = " Provider = Microsoft.Jet.OLEDB.4.0; Data Source = " + sRouter ;
 32InBlock.gif            //创建一个数据库连接
 33InBlock.gif
 34InBlock.gif            OleDbConnection myConn = new OleDbConnection ( strCon ) ;
 35InBlock.gif            string strCom = " SELECT YF ,SL FROM MonthSale ORDER BY YF" ;
 36InBlock.gif            myConn.Open ( ) ;
 37InBlock.gif            OleDbCommand myCommand = new OleDbCommand ( strCom , myConn ) ;
 38InBlock.gif            OleDbDataReader myOleDbDataReader = myCommand.ExecuteReader ( ) ;
 39InBlock.gif            //创建OleDbDataReader实例,并以此实例来获取数据库中各条记录数据
 40InBlock.gif
 41InBlock.gif            int [ ] iXiaoSH = new int [ 12 ] ;
 42InBlock.gif            //定义一个数组,用以存放从数据库中读取的销售数据
 43InBlock.gif
 44InBlock.gif            string [ ] sMoth = new string [ 12 ] ;
 45InBlock.gif            //定义一个数组,用以存放从数据库中读取的销售月份
 46InBlock.gif
 47InBlock.gif            int iIndex = 0 ;
 48InBlock.gif            while ( myOleDbDataReader.Read ( ) ) 
 49ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
 50InBlock.gif                iXiaoSH [ iIndex ] = myOleDbDataReader.GetInt32 ( 1 ) ;
 51InBlock.gif                sMoth [ iIndex ] = myOleDbDataReader.GetInt32 ( 0 ) . ToString ( ) + "" ;
 52InBlock.gif                iIndex++ ;
 53ExpandedSubBlockEnd.gif            }

 54InBlock.gif            //读取Table01数据表中的各条数据,并存放在先前定义的二个数组中
 55InBlock.gif
 56InBlock.gif            myConn . Close ( ) ;
 57InBlock.gif            myOleDbDataReader . Close ( ) ;
 58InBlock.gif            //关闭各种资源
 59InBlock.gif
 60InBlock.gif            Bitmap bm = new Bitmap ( 600 , 250 ) ;
 61InBlock.gif            //创建一个长度为600,宽带为250的Bitmap实例
 62InBlock.gif
 63InBlock.gif            Graphics g ;
 64InBlock.gif            g = Graphics.FromImage ( bm ) ;
 65InBlock.gif            //由此Bitmap实例创建Graphic实例
 66InBlock.gif
 67InBlock.gif            g . Clear ( Color.Snow) ;
 68InBlock.gif            //用Snow色彩为背景色填充此绘画图面
 69InBlock.gif
 70InBlock.gif            g . DrawString ( " ××公司××××年度销售情况统计表" , new Font ( "黑体" , 16 ) , Brushes . Black , new Point ( 5 , 5 ) ) ;
 71InBlock.gif            //在绘画图面的指定位置,以指定的字体、指定的颜色绘制指定的字符串。即为图表标题
 72InBlock.gif
 73InBlock.gif            //以下代码是是实现图右上部
 74InBlock.gif            Point myRec = new Point ( 535 , 30 ) ;
 75InBlock.gif            Point myDec = new Point ( 560 , 26 ) ;
 76InBlock.gif
 77InBlock.gif            //以上是在图01中为下面绘制定位
 78InBlock.gif            g . DrawString ( "单位:万套" , new Font ( "宋体" , 9 ) , Brushes . Black , new Point ( 525 , 12 ) ) ;
 79InBlock.gif   
 80InBlock.gif   
 81InBlock.gif            for ( int i = 0 ; i < sMoth.Length ; i++ ) 
 82ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
 83InBlock.gif                g . DrawRectangle ( Pens.Black , myRec . X , myRec . Y , 20 , 10 ) ;
 84InBlock.gif                //绘制小方块
 85InBlock.gif
 86InBlock.gif                g . FillRectangle ( new SolidBrush ( GetColor ( i ) ) , myRec.X , myRec.Y , 20 , 10 ) ;
 87InBlock.gif                //填充小方块
 88InBlock.gif
 89InBlock.gif                g . DrawString ( sMoth [ i ] . ToString ( ) , new Font ( "宋体" , 9 ) , Brushes . Black , myDec ) ;
 90InBlock.gif                //绘制小方块右边的文字
 91InBlock.gif
 92InBlock.gif                myRec . Y += 15 ;
 93InBlock.gif                myDec . Y += 15 ;
 94ExpandedSubBlockEnd.gif            }

 95InBlock.gif
 96InBlock.gif            //以下代码是绘制Bar图,及其销售数量
 97InBlock.gif            int iBarWidth = 40 ;
 98InBlock.gif            int scale = 10 ;
 99InBlock.gif            for ( int i = 0 ; i < iXiaoSH . Length ; i++ ) 
100ExpandedSubBlockStart.gifContractedSubBlock.gif            dot.gif{
101InBlock.gif                g . DrawRectangle ( Pens.Black, ( i * iBarWidth ) + 15 , 250 - ( iXiaoSH [ i ] * scale ) , 20 , ( iXiaoSH [ i ] * scale ) + 5 ) ;
102InBlock.gif                //绘制Bar图
103InBlock.gif
104InBlock.gif                g . FillRectangle ( new SolidBrush (GetColor ( i )) , ( i * iBarWidth ) + 15 , 250 - ( iXiaoSH [ i ] * scale ) , 20 , ( iXiaoSH [ i ] * scale ) + 5 ) ;
105InBlock.gif                //以指定的色彩填充Bar图
106InBlock.gif
107InBlock.gif                g . DrawString ( iXiaoSH [ i ] . ToString ( ) , new Font ( "宋体" , 9 ) , Brushes . Black , ( i * iBarWidth ) + 20 , 235 - ( iXiaoSH [ i ] * scale ) ) ;
108InBlock.gif                //显示Bar图代表的数据
109ExpandedSubBlockEnd.gif            }

110InBlock.gif
111InBlock.gif            //以下代码是绘制边框,并形成Jpeg文件,供浏览器显示出来
112InBlock.gif            Pen p = new Pen ( Color.Black , 2 ) ;
113InBlock.gif            g . DrawRectangle ( p , 1 , 1 , 598 , 248 ) ;
114InBlock.gif            bm.Save ( Response . OutputStream , ImageFormat.Gif) ;
115ExpandedSubBlockEnd.gif        }

116InBlock.gif
117ContractedSubBlock.gifExpandedSubBlockStart.gif        Web 窗体设计器生成的代码#region Web 窗体设计器生成的代码
118InBlock.gif        override protected void OnInit(EventArgs e)
119ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
120InBlock.gif            //
121InBlock.gif            // CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
122InBlock.gif            //
123InBlock.gif            InitializeComponent();
124InBlock.gif            base.OnInit(e);
125ExpandedSubBlockEnd.gif        }

126InBlock.gif        
127ExpandedSubBlockStart.gifContractedSubBlock.gif        /**//// <summary>
128InBlock.gif        /// 设计器支持所需的方法 - 不要使用代码编辑器修改
129InBlock.gif        /// 此方法的内容。
130ExpandedSubBlockEnd.gif        /// </summary>

131InBlock.gif        private void InitializeComponent()
132ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{    
133InBlock.gif            this.Load += new System.EventHandler(this.Page_Load);
134ExpandedSubBlockEnd.gif        }

135ExpandedSubBlockEnd.gif        #endregion

136InBlock.gif        
137ExpandedSubBlockStart.gifContractedSubBlock.gif        /**//// <summary>
138InBlock.gif        /// 获取颜色
139InBlock.gif        /// </summary>
140InBlock.gif        /// <param name="itemIndex">数组的索引</param>
141ExpandedSubBlockEnd.gif        /// <returns></returns>

142InBlock.gif        private Color GetColor ( int itemIndex ) 
143ExpandedSubBlockStart.gifContractedSubBlock.gif        dot.gif{
144InBlock.gif             Color MyColor ;
145InBlock.gif             int i = itemIndex ;
146InBlock.gif            switch (i) 
147ExpandedSubBlockStart.gifContractedSubBlock.gif             dot.gif{
148InBlock.gif                  case 0 :
149InBlock.gif                   MyColor = Color.Green;
150InBlock.gif                   return MyColor;
151InBlock.gif                  case 1 :
152InBlock.gif                   MyColor = Color.Red;
153InBlock.gif                    return MyColor;
154InBlock.gif                  case 2:
155InBlock.gif                   MyColor = Color.Yellow;
156InBlock.gif                   return MyColor;
157InBlock.gif                  case 3 :
158InBlock.gif                   MyColor = Color.Blue;
159InBlock.gif                   return MyColor;
160InBlock.gif                  case 4 :
161InBlock.gif                   MyColor = Color.Orange;
162InBlock.gif                   return MyColor;
163InBlock.gif                 case 5 :
164InBlock.gif                   MyColor = Color.Aqua;
165InBlock.gif                   return MyColor;
166InBlock.gif                  case 6:
167InBlock.gif                   MyColor = Color.SkyBlue;
168InBlock.gif                   return MyColor;
169InBlock.gif                  case 7:
170InBlock.gif                   MyColor = Color.DeepPink;
171InBlock.gif                   return MyColor;
172InBlock.gif                  case 8:
173InBlock.gif                   MyColor = Color.Azure;
174InBlock.gif                   return MyColor;
175InBlock.gif                  case 9:
176InBlock.gif                   MyColor = Color.Brown;
177InBlock.gif                   return MyColor;
178InBlock.gif                  case 10:
179InBlock.gif                   MyColor = Color.Pink;
180InBlock.gif                   return MyColor;
181InBlock.gif                  case 11:
182InBlock.gif                   MyColor = Color.BurlyWood;
183InBlock.gif                   return MyColor;
184InBlock.gif                  case 12:
185InBlock.gif                   MyColor = Color.Chartreuse;
186InBlock.gif                   return MyColor;
187InBlock.gif                  default:
188InBlock.gif                   MyColor = Color.Pink;
189InBlock.gif                   return MyColor;
190ExpandedSubBlockEnd.gif            }

191ExpandedSubBlockEnd.gif        }

192InBlock.gif
193ExpandedSubBlockEnd.gif    }

194ExpandedBlockEnd.gif}

195 None.gif
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值