目录:


GDI+概述

数据图表绘制函数

数据图表用户控件

总结


摘要

本文是在概述GDI+的基础上,简单的介绍如何绘制数据图表,并在此基础上将其做成一个用户控件。便于读者及用户的使用。

GDI+概述

提到GDI+,我们不得不先提到一个大家都比较熟悉的概念GDI(Graphical Device Interface),GDI就像是加在操作系统和显卡之间的一个中间层。用来屏蔽不同的显卡给绘图带来的差异。有了它,用户只用调用专门的Windows API 函数来执行用户所要的绘图操作,而此时的GDI让你的不同的显卡去做你要做的事情。虽然GDI提供了相当方便的应用程序开发接口给开发者,但是它依然是基于过去比较老的Windows API版本,而且都是C语言风格的函数。所以使用起来就并不是太方便。

所谓GDI+呢,它就像一个位于GDI和你的应用程序之间的一个中间层。它提供了更加直观,基于继承的对象模型。尽管GDI+像GDI外面包裹的一层表皮,但是微软声称GDI+提供了新的特色并且有着一些性能上的提高。

数据图表绘制函数:

下面我先提供一个简单的绘制图表文件的函数:

      

publicvoid Render(string title,string subTitle,int width,int
         { 
  
              const int
              const int
              ChartData cd = chartData; 
  
              float
              for(int
              { 
  
                   sumData += float.Parse(cd.DataValue[i].ToString()); 
  
              } 
  
              //产生一个image对象,并由此产生一个Graphics对象 
   
              Bitmap bm = new
              Graphics g = tempGraphics; 
  
              //设置对象g的属性                         
              g.ScaleTransform((Convert.ToSingle(width))/SIDE_LENGTH,(Convert.ToSingle(height))/SIDE_LENGTH); 
  
              g.SmoothingMode = SmoothingMode.Default; 
  
              g.TextRenderingHint = TextRenderingHint.AntiAlias; 
  
 
  
      
  
              //画布和边的设定 
   
              g.Clear(Color.White); 
  
              g.DrawRectangle(Pens.Black,0,0,SIDE_LENGTH-1,SIDE_LENGTH-1); 
  
              //画饼图标题 
   
              g.DrawString(title,new Font("Tahoma",24),Brushes.Black,new
              //画饼图的图例 
   
              g.DrawString(subTitle,new Font("Tahoma",14),Brushes.Black,new
              //画饼图 
   
              float
              float
              for(int
              { 
  
                   curAngle = Convert.ToSingle(float.Parse(cd.DataValue[i].ToString())) / sumData * 360; 
  
                   g.FillPie(new
                   g.DrawPie(Pens.Black,100,65,PIE_DIAMETER,PIE_DIAMETER,totalAngle,curAngle); 
  
                   totalAngle += curAngle; 
  
              } 
  
              //画图例框及其文字 
   
              g.DrawRectangle(Pens.Black,200,300,199,99); 
  
              g.DrawString("Unique",new Font("Tahoma",12,FontStyle.Bold),Brushes.Black,new
              //画图例各项 
   
              PointF boxOrigin = new
              PointF textOrigin = new
              float
              for(int
              { 
  
                   g.FillRectangle(new
                   g.DrawRectangle(Pens.Black,boxOrigin.X,boxOrigin.Y,20,10); 
  
                   percent = Convert.ToSingle(float.Parse(cd.DataValue[i].ToString())) / sumData * 100; 
  
                   g.DrawString(cd.DataName[i].ToString()+ " (" + percent.ToString("0") + "%)",new
                   boxOrigin.Y += 15; 
  
                   textOrigin.Y += 15; 
  
              } 
  
         }    
上述函数是绘制一个简单的饼型的数据视图,它的参数表中有Title是该图的标题信息。SubTitle是该图的副标题信息,同时后面两个为该图的尺寸信息Width和Height。接下来为提供给该数据视图的数据源ChartData,它是一个笔者必定义的一个类,专门用来提供给数据视图的数据源。后面将专门提到。最后就是一个Graphics对象,函数中的绘制操作都是针对这个Graphics来做的,同时这个函数是没有返回值的,但是这个外部传入的Graphics对象其实就相当一个返回值。 
   
数据图表用户控件: 
    
为了便于以后的重用,所以将其写成一个用户控件,然后再次使用时候只要像使用开发环境自带的那些控件一样,先将此用户控件注册到Visual Studio .net左则的工具箱选项卡中。然后你使用就可以将它托到你的界面上,同时你可以使用开发环境右边的属性诓来设置你相应的属性,比如上面提到的Title,SubTitle,DataSource等等。 
   
    我们回顾上面提到的绘制函数中的数据源ChartData;在用户控件中我们将其设置为该用户控件DataChart的一个属性DataSource。在此我们为什么要自己写一个专门的类来存储数据,关键在于笔者设计时遇到的数据一般都是像(“星期一”,100)这样的数据对。当然由于我们绘制的是二维的数据图表,显然我们的有用数据都会像这样的模式。这就存在着如何提供更加优美的数据接口的问题。当然你可以就用一个DataTable,但是这样就会给我们测试或者用户的使用带来灵活性的局限,特别是当你要临时添加或者删除一个数据对的时候。同时也会让我们上面的这个绘制函数显的不直观。当然你也可以用其他的数据源方式,我们在此用了自己设计的一个类如下: 
   
#region 图表数据源类型 
   
     public class
     { 
  
         #region 字段和属性 
   
         private
         private
         public
         { 
  
              get{return
              set{dataValue = value;} 
  
         } 
  
         public
         { 
  
              get{return
              set{dataValue = value;} 
  
         } 
  
         #endregion 
  
 
  
      
  
         #region 公开的构造函数和方法 
   
         //无参数构造函数 
   
         public
         { 
  
              dataName = new
              dataValue = new
         } 
  
         //参数为两个ArrayList构造函数 
   
         public
         { 
  
              dataName = tempDataName; 
  
              dataValue = tempDataValue; 
  
         } 
  
         //参数为一个DataTable构造函数 
   
         public
         { 
  
              DataTable dt = tempData; 
  
              foreach(DataRow dr in
              { 
  
                   this.dataName.Add(dr[0].ToString()); 
  
                   this.dataValue.Add(dr[1].ToString()); 
  
              } 
  
         } 
  
         public void Add(string tempName, float
         { 
  
              dataName.Add(tempName); 
  
              dataValue.Add(tempValue); 
  
         } 
  
         //Remove 方法存在很大的问题,就是不能够知道ArrayList中是否存在当前的变量。导致无法得知操作结果 
   
         //我使用了binarySearch,不知道可不可以实现功能 
   
         public bool Remove(string tempName,float
         { 
  
              if(dataName.BinarySearch(tempName) > 0 && dataValue.BinarySearch(tempValue) > 0) 
  
              { 
  
                   dataName.Remove(tempName); 
  
                   dataValue.Remove(tempValue); 
  
                   return true; 
  
              } 
  
              else 
   
              { 
  
                   return false; 
  
              } 
  
         } 
  
         #endregion 
  
     } 
  
     #endregion 
  
在这个数据类中定义了两个ArrayList分别来存储我们有用的数据对,同时提供了三种不同的构造函数来提供多样话的数据接口,如果你只是为了测试这个用户控件、或者你是一个小型的应用程序你的数据来源于非数据库的方式。你可以使用无参数或者是提供两个ArrayList参数的构造函数,这样你可以通过Add方法来添加你的数据对,同时也可以使用Remove方法来删除你不需要的数据对。当然如果你的数据来源于一个数据库。你也可以使用提供一个DataTable参数的构造函数。 
   
接下来就是提供几个属性用来设置用户控件的相应参数,比如前面提到的Title,SubTitle,DataSource以及Height,Width.让用户根据自己的需要去定制这些参数。同时我们复写OnPaint方法来绘制我们的用户控件的区域。 
   
protectedoverride void
         { 
  
              Graphics gr = e.Graphics;   
              PieChart pc = new PieChart();             
              pc.Render(this.Title,this.SubTitle,this.ChartWidth,this.ChartHeight,this.DataSource,gr);          base.OnPaint(e); 
  
         }

总结:

上面提供了如何去绘制一个简单的数据图表,并且将其写成一个用户控件。同时里面提到如何去提供一个灵活的数据接口。虽然比较简单,但是还是值得我们去思考的。同时也存在一定的问题,比如标题的位置信息,以及图表视图中图例框的位置及信息都是相当的死板。还是希望读者能够加以改进。