在应用程序开发中，我们会经常遇到把从数据源动态取回的数据用统计图表现出来，在Microsoft .NET Framework出现之前，我们采取的方法主要是编写组件来完成这一任务。现在，利用Microsoft .NET Framework提供的丰富的GDI+类和对象可以很轻松地实现这一功能。在本文中，我们就来看看在ASP.NET中如何动态创建常用的柱状图和饼图。数据源有许多种，在本文里我们就以数组来进行示例，但本例的方法很容易转换成数据库类型的数据源来进行。
第一步：创建一个新的ASP.NET项目。
打开Microsoft Visual Studio .NET，点击“文件(File)”-“新建(New)”-“项目(Project)”，打开“新建项目(New Project)”对话框，在“项目类型(Project Types)”里选择“Visual Basic 项目(Projects)”，在“模板(Templates)”里选择“ASP.NET应用程序(Web Application)”，在应用程序地址里输入：http://localhost/aspCharts，点击“确定(OK)”按钮，Microsoft Visual Studio .NET将会自动在wwwroot目录下创建一个名为aspCharts的Web工程。
第二步：为默认起始页编写代码（AspxChart.aspx）。
我们要在这个页面里显示动态创建的图形，打开AspxChart.aspx的标签页的“HTML”视图，插入下面的代码：
第三步：添加名为Chart.aspx的Web窗体页。
打开“解决方案资源管理器(Solution Explorer)”，在“aspCharts项目”上点击右键，选择“添加(Add)”-“添加新项(Add New Item)”，弹出“添加新项(Add New Item)”对话框，在右边的“模板”里选择“Web 窗体”，在底下的名字输入框了输入“Chart.aspx”，点击“打开”按钮。
第四步：为“Chart.aspx”Web 窗体页添加代码。
在“Chart.aspx”窗体上点击右键，选择“查看代码(View Code)”，在代码的第一行添加下面二行：
好了，我们的代码已经写完，点击“全部保存”按钮，然后按“F5”执行，看看最好的结果。如果没有错误的话，您将会看到如下的结果：
值得说明的是，上面只是简单地示例了如何利用.NET 框架类库中的图形类创建简单的图形，但.NET 框架类库中还提供了更高级的二维和矢量图形功能，利用这些高级功能，我们可以创建出二维或矢量的图形，那时，我们的图形看起来会更加形象。
本文所有代码在简体中文Windows 2000 + .NET FrameWork 1.0（英文正式版）+ .NET FrameWork SP1和Windows XP + .NET FrameWork 1.0（中文版）下调试通过。
C#代码
using System; using System.Collections; using System.ComponentModel; using System.Data; using System.Drawing; using System.Web; using System.Web.SessionState; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.HtmlControls; using System.Drawing.Imaging; namespace eMeng.Exam { /// <summary> /// Chart 的摘要说明。 /// </summary> public class Chart : System.Web.UI.Page { private void Page_Load(object sender, System.EventArgs e) { // 在此处放置用户代码以初始化页面 Bitmap objBitMap = new Bitmap(400, 200); Graphics objGraphics; objGraphics = Graphics.FromImage(objBitMap); objGraphics.Clear(Color.White); int[] arrValues = {100,135,115,125,75,120}; string[] arrValueNames = new string[]{"一月","二月","三月","四月","五月","六月"}; objGraphics.DrawString(" X 公司上半年销售情况", new Font("宋体", 16), Brushes.Black, new PointF(5, 5)); PointF symbolLeg = new PointF(335, 20); PointF descLeg = new PointF(360, 16); for (int i = 0; i < arrValueNames.Length; i++) { objGraphics.FillRectangle(new SolidBrush(GetColor(i)), symbolLeg.X, symbolLeg.Y, 20, 10); objGraphics.DrawRectangle(Pens.Black, symbolLeg.X, symbolLeg.Y, 20, 10); objGraphics.DrawString(arrValueNames[i].ToString(), new Font("宋体", 10), Brushes.Black, descLeg); symbolLeg.Y += 15; descLeg.Y += 15; } for (int i = 0; i < arrValues.Length; i++) { objGraphics.FillRectangle(new SolidBrush(GetColor(i)), (i * 35) + 15, 200 - arrValues[i], 20, arrValues[i] + 5); objGraphics.DrawRectangle(Pens.Black, (i * 35) + 15, 200 - arrValues[i], 20, arrValues[i] + 5); } float sglCurrentAngle = 0; float sglTotalAngle = 0; float sglTotalValues = 0; for (int i = 0; i <= arrValues.Length - 1; i++) { sglTotalValues += arrValues[i]; } for (int i = 0; i < arrValues.Length; i++) { sglCurrentAngle = arrValues[i] / sglTotalValues * 360; objGraphics.FillPie(new SolidBrush(GetColor(i)), 220, 95, 100, 100, sglTotalAngle, sglCurrentAngle); objGraphics.DrawPie(Pens.Black, 220, 95, 100, 100, sglTotalAngle, sglCurrentAngle); sglTotalAngle += sglCurrentAngle; } objBitMap.Save(Response.OutputStream, ImageFormat.Gif); } private Color GetColor(int itemIndex) { Color objColor; if (itemIndex == 0) { objColor = Color.Blue; } else if (itemIndex == 1) { objColor = Color.Red; } else if (itemIndex == 2) { objColor = Color.Yellow; } else if (itemIndex == 3) { objColor = Color.Purple; } else if (itemIndex == 4) { objColor = Color.Orange; } else if (itemIndex == 5) { objColor = Color.Brown; } else if (itemIndex == 6) { objColor = Color.Gray; } else if (itemIndex == 7) { objColor = Color.Maroon; } else if (itemIndex == 8) { objColor = Color.Maroon; } else { objColor = Color.Blue; } return objColor; } #region Web 窗体设计器生成的代码 override protected void OnInit(EventArgs e) { // // CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。 // InitializeComponent(); base.OnInit(e); } /// <summary> /// 设计器支持所需的方法 - 不要使用代码编辑器修改 /// 此方法的内容。 /// </summary> private void InitializeComponent() { this.Load += new System.EventHandler(this.Page_Load); } #endregion } }| 本文评论(Comments)：为了保护您的电子邮件不被骚扰，地址中的个别符号转换成了全角字符！ | |||
| 评论人：enjsky | 电子邮件：gzj114＠163．com | 评论日期：2004年08月31日 04:07:45 | |
| 在饼状图上如何标示数据 的我已经解决了，发给大家看一下，学习....
C#代码如下：
/// /// Chart 的摘要说明。 /// public class Chart : System.Web.UI.Page { private void Page_Load(object sender, System.EventArgs e) { // 在此处放置用户代码以初始化页面 Bitmap objBitMap = new Bitmap(700, 500); Graphics objGraphics; objGraphics = Graphics.FromImage(objBitMap); objGraphics.Clear(Color.White); StringFormat drawFormat = new System.Drawing.StringFormat(StringFormatFlags.DirectionVertical); StringFormat drawFormat1 = new System.Drawing.StringFormat(StringFormatFlags.DisplayFormatControl); int[] arrValues = {300,135,115,125,75,120}; string[] arrValueNames = new string[]{"一月","二月","三月","四月","五月","六月"}; objGraphics.DrawString(" X 公司上半年销售情况", new Font("宋体", 16), Brushes.Black,200,0,drawFormat1); PointF symbolLeg = new PointF(500, 20); PointF descLeg = new PointF(560, 16); //显示什么颜色代表什么的 for (int i = 0; i < arrValueNames.Length; i++) { objGraphics.FillRectangle(new SolidBrush(GetColor(i)), symbolLeg.X, symbolLeg.Y, 20, 10); objGraphics.DrawRectangle(Pens.Black, symbolLeg.X, symbolLeg.Y, 20, 10); objGraphics.DrawString(arrValueNames[i].ToString(), new Font("宋体", 10), Brushes.Black, descLeg); symbolLeg.Y += 15; descLeg.Y += 15; } for (int i = 0; i < arrValues.Length; i++) { objGraphics.FillRectangle(new SolidBrush(GetColor(i)), (i * 35) + 15, 400 - arrValues[i], 20, arrValues[i] + 5); objGraphics.DrawRectangle(Pens.Black, (i * 35) + 15, 400 - arrValues[i], 20, arrValues[i] + 5); objGraphics.DrawString(arrValueNames[i].ToString() + "【"+ arrValues[i].ToString()+"】", new Font("宋体", 10), Brushes.Black,(i * 35) + 15,310 - arrValues[i], drawFormat);
}
}
#region Web 窗体设计器生成的代码
/// /// 设计器支持所需的方法 - 不要使用代码编辑器修改 /// 此方法的内容。 /// private void InitializeComponent() { this.Load += new System.EventHandler(this.Page_Load); } #endregion } } |
|||
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。