asp.net画曲线图(折线图)代码 详细注释

复制代码 代码如下:

  using System;

  using System.Collections;

  using System.Configuration;

  using System.Data;

  using System.Web;

  using System.Web.Security;

  using System.Web.UI;

  using System.Web.UI.HtmlControls;

  using System.Web.UI.WebControls;

  using System.Web.UI.WebControls.WebParts;

  //添加画图类

  using System.Drawing.Drawing2D;

  using System.Drawing.Imaging;

  using System.Drawing;

  using System.IO;

  using System.Data.SqlClient;

  public partial class Curve_Default : System.Web.UI.Page

  {

  protected void Page_Load(object sender, EventArgs e)

  {

  if (!IsPostBack)

  {

  Get_CurveData();

  }

  }

  //获取数据

  public void Get_CurveData()

  {

  SqlConnection conn = null;

  try

  {

  conn = CommonFunction.CreateDBTest();

  conn.Open();

  SqlCommand cmd = conn.CreateCommand();

  string sqlStr = "SELECT * FROM CURVE ORDER BY TESTDATE";

  DataTable dt = CommonFunction.ExecuteDatable(conn, cmd, CommandType.Text, sqlStr, null);

  draw(dt);

  }

  catch (Exception exp)

  {

  Response.Write(exp.Message);

  }

  finally

  {

  if (conn != null)

  conn.Close();

  }

  }

  public void draw(DataTable dt)

  {

  //取得记录数量

  int count = dt.Rows.Count;

  //记算图表宽度

  int wd = 80 + 20 * (count - 1);

  //设置最小宽度为800

  if (wd < 600) wd = 600;

  //生成Bitmap对像

  Bitmap img = new Bitmap(wd, 400);

  //生成绘图对像

  Graphics g = Graphics.FromImage(img);

  //定义黑色画笔

  Pen Bp = new Pen(Color.Black);

  //定义红色画笔

  Pen Rp = new Pen(Color.Red);

  //定义银灰色画笔

  Pen Sp = new Pen(Color.Silver);

  //定义大标题字体

  Font Bfont = new Font("Arial", 12, FontStyle.Bold);

  //定义一般字体

  Font font = new Font("Arial", 6);

  //定义大点的字体

  Font Tfont = new Font("Arial", 9);

  //定义横坐标间隔,(最佳值是总宽度-留空宽度[左右侧都需要])/(记录数量-1)

  int xSpace = (wd - 100) / (count - 1);

  //定义纵坐标间隔,不能随便修改,跟高度和横坐标线的条数有关,最佳值=(绘图的高度-上面留空-下面留空)

  int ySpace = 30;

  //纵坐标最大值和间隔值

  int yMaxValue = 30;

  //绘制底色

  g.DrawRectangle(new Pen(Color.White, 400), 0, 0, img.Width, img.Height);

  //定义黑色过渡型笔刷

  LinearGradientBrush brush = new LinearGradientBrush(new Rectangle(0, 0, img.Width, img.Height), Color.Black, Color.Black, 1.2F, true);

  //定义蓝色过渡型笔刷

  LinearGradientBrush Bluebrush = new LinearGradientBrush(new Rectangle(0, 0, img.Width, img.Height), Color.Blue, Color.Blue, 1.2F, true);

  //绘制大标题

  g.DrawString("测试曲线图", Bfont, brush, 40, 5);

  //绘制信息简报

  string info = " 曲线图生成时间:" + DateTime.Now.ToString();

  g.DrawString(info, Tfont, Bluebrush, 40, 25);

  //绘制图片边框

  g.DrawRectangle(Bp, 0, 0, img.Width - 1, img.Height - 1);

  //绘制竖坐标轴

  g.DrawLine(Bp, 40, 55, 40, 360);

  //绘制横坐标轴 x2的60是右侧空出部分

  g.DrawLine(Bp, 40, 360, 60 + xSpace * (count - 1), 360);

  //绘制竖坐标标题

  g.DrawString("测试值", Tfont, brush, 5, 40);

  //绘制横坐标标题

  g.DrawString("测试时间", Tfont, brush, 40, 385);

  //绘制竖坐标线

  for (int i = 0; i < count; i++)

  {

  g.DrawLine(Sp, 40 + xSpace * i, 60, 40 + xSpace * i, 360);

  }

  //绘制时间轴坐标标签

  for (int i = 0; i < count; i++)

  {

  string st = Convert.ToDateTime(dt.Rows[i]["testdate"]).ToString("MM:dd");

  g.DrawString(st, font, brush, 30 + xSpace * i, 370);

  }

  //绘制横坐标线

  for (int i = 0; i < 10; i++)

  {

  g.DrawLine(Sp, 40, 60 + ySpace * i, 40 + xSpace * (count - 1), 60 + ySpace * i);

  //横坐标轴的值间隔是最大值除以间隔数

  int s = yMaxValue - i * (yMaxValue / 10);

  //绘制发送量轴坐标标签

  g.DrawString(s.ToString(), font, brush, 10, 60 + ySpace * i);

  }

  //定义纵坐标单位数值=纵坐标最大值/标量最大值(300/30)

  int yAveValue = 10;

  //定义曲线转折点

  Point[] p = new Point[count];

  for (int i = 0; i < count; i++)

  {

  p[i].X = 40 + xSpace * i;

  p[i].Y = 360 - Convert.ToInt32(dt.Rows[i]["testvalue"]) * yAveValue;

  }

  //绘制折线图

  //g.DrawLines(Rp, p);

  //绘制曲线图

  //g.DrawCurve(Rp, p);

  //绘制自定义张力的曲线图(0.5F是张力值,默认就是这个值)

  g.DrawCurve(Rp, p,0.5F);

  //当需要在一个图里绘制多条曲线的时候,就多定义个point数组,然后画出来就可以了。

  for (int i = 0; i < count; i++)

  {

  //绘制发送记录点的发送量

  g.DrawString(dt.Rows[i]["testvalue"].ToString(), font, Bluebrush, p[i].X, p[i].Y - 10);

  //绘制发送记录点

  g.DrawRectangle(Rp, p[i].X - 1, p[i].Y - 1, 2, 2);

  }

  //保存绘制的图片

  MemoryStream stream = new MemoryStream();

  img.Save(stream, ImageFormat.Jpeg);

  //图片输出

  Response.Clear();

  Response.ContentType = "image/jpeg";

  Response.BinaryWrite(stream.ToArray());

  }

  }

  数据表的内容很简单,就两个字段:testValue和testDate,由于图的纵坐标有最大值,所以testValue的值不能超过30,当然,你可以调整坐标轴的单位或者高度。

  12 2008-12-1 0:00:00

  9 2008-12-5 0:00:00

  20 2008-12-10 0:00:00

  18 2008-12-15 0:00:00

  27 2008-12-20 0:00:00

  8 2008-12-25 0:00:00

  15 2008-12-30 0:00:00

  25 2009-1-1 0:00:00

  23 2009-1-5 0:00:00