asp.net页面统计报表的实现

原来一直用DataGrid来表达数据库中的数据，发现如果用报表来显示的话效果更明显

方法一：是用.NET框架下的GDI+

GDI+提供了一系列的Bitmap, Graphics, Brushes, Pens来绘制图

.cs

using Sytem.Drawing.Image;

   const int width = 600, height = 400;
   Bitmap myPalette = new Bitmap( width, height );
   Graphics myGraphics = Graphics.FromImage( myPalette );
   myGraphics.FillRectangle( new SolidBrush( Color.White ), 0, 0, width, height );
   //设定显示数据
   string [] DataName = { "Jan", "Feb", "Mar", "Apr", "May", "Jun" };
   int [] Data = { 100, 20, 50, 60, 240, 20 };
   //设定显示颜色
   Color [] myColors = { Color.Blue, Color.Red, Color.Yellow, Color.Purple, Color.Orange, Color.Brown
        };
   //绘制柱面图
   for( int i=0; i<DataName.Length; i++ )
   {
    //填充柱面图
    myGraphics.FillRectangle( new SolidBrush( myColors[i] ), (i*40)+30, 300-Data[i], 20, Data[i] );
    //绘制柱面图边界
    myGraphics.DrawRectangle( new Pen(Color.Black), (i*40)+30, 300-Data[i], 20, Data[i] );
    //绘制柱面图上放数据
    myGraphics.DrawString( Data[i].ToString(), new Font( "宋体", 9 ), Brushes.Black, new PointF( (i*40)+30, 300-Data[i]-20 ) ); //300-Data[i]-20 )
    //绘制柱面图下表
    myGraphics.DrawString( DataName[i], new Font( "宋体", 9 ), Brushes.Black, new PointF( (i*40)+30, 320 ) ); //320
   }
   //输出图
   myPalette.Save( Response.OutputStream, ImageFormat.Jpeg );
   //清除所有绘图对象
   myGraphics.Dispose();
   myPalette.Dispose();

效果图：

 

方法二：是用Microsoft Office Web Components

Microsoft Office Web Components是用于向Web页面添加电子表格，图标等数据处理功能的ActiveX，使用时不需要考虑画图方面的细节。在使用OWC时，系统中必须安装OFFICE，版本在2000及以上。

.cs

在引用中添加Microsoft Office Web Components 11.0，注意office 2000为9.0版本。

   string [] DataName = { "Jan", "Feb", "Mar", "Apr", "May", "Jun" };
   int [] Data = { 100, 20, 50, 60, 200, 20 };

   string strDataName = "";
   string strData = "";

   for( int i=0; i<Data.Length; i++ )
   {
    strDataName += DataName[i] + "/t";
    strData += Data[i].ToString() + "/t";
   }
   
   //创建chartSpace对象来放置图表
   OWC11.ChartSpace objCSpace = new OWC11.ChartSpaceClass();
   //使用chartSpace对象的add方法来创建图表，参数表示所创建图表的索引
   OWC11.ChChart objChart = objCSpace.Charts.Add( 0 );
   //制定图表的类型
   objChart.Type = OWC11.ChartChartTypeEnum.chChartTypePie;
   
   //指定图表是否需要图例
   objChart.HasLegend = true;
   //给定标题
   objChart.HasTitle = true;
   objChart.Title.Caption = "上半年月收入";

   objChart.SeriesCollection.Add( 0 );

   //给定series的名字
   objChart.SeriesCollection[0].SetData (OWC11.ChartDimensionsEnum.chDimSeriesNames, (int)OWC11.ChartSpecialDataSourcesEnum.chDataLiteral, "图例1");
  
   //给定分类
   objChart.SeriesCollection[0].SetData (OWC11.ChartDimensionsEnum.chDimCategories, (int)OWC11.ChartSpecialDataSourcesEnum.chDataLiteral, strDataName);

   //给定值
   objChart.SeriesCollection[0].SetData(OWC11.ChartDimensionsEnum.chDimValues, (int)OWC11.ChartSpecialDataSourcesEnum.chDataLiteral, strData );

   objCSpace.ExportPicture( Server.MapPath("") + @"/tmpFile.gif", "GIF", 400, 300 );

   //Bitmap myPalette = new Bitmap( Server.MapPath("") + @"/tmpFile.gif", true );
   //myPalette.Save( Response.OutputStream, System.Drawing.Imaging.ImageFormat.Gif );
   string strImageTag = "<img src='" + Server.MapPath("") + @"/tmpFile.gif" + "'/>";
   ChartPlaceHolder.Controls.Add( new LiteralControl( strImageTag ) );

效果图：

OWC显示柱面图的效果也非常的好看，只需要在上面的程序中修改很小的一部分

1 类型：

//制定图表的类型
   objChart.Type = OWC11.ChartChartTypeEnum.chChartTypeColumnClustered;

2 设置x , y 的坐标：

//指定图表是否需要图例
   objChart.HasLegend = true;
   //给定标题
   objChart.HasTitle = true;
   objChart.Title.Caption = "上半年月收入";
   //给定x，y轴的图示说明
   objChart.Axes[0].HasTitle = true;
   objChart.Axes[0].Title.Caption = "Y: 数量";
   objChart.Axes[1].HasTitle = true;
   objChart.Axes[1].Title.Caption = "X: 月份";

用他们来显示数据库中的数据，一门了然，非常的清晰。客户也一定会非常的满意，当然，色彩的搭配也相当的重要咯。。。。。。