asp.net画曲线图(折线图)代码 详细注释
程序员文章站
2024-03-08 20:53:16
复制代码 代码如下: using system; using system.collections; using system.configuration; using s...
复制代码 代码如下:
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