在网页上指定位置绘制折线图

1 新建一个网页（.aspx），在网页上完成绘图代码。（绘图代码为转载）

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using System.Data.OracleClient;

//添加画图类

using System.Drawing.Drawing2D;

using System.Drawing.Imaging;

using System.Drawing;

using System.IO;

 

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

{

    OracleConnection connection = new OracleConnection();

    OracleCommand command = new OracleCommand();

    string strCon = "Data Source=LAKEPROJECT;User ID=pyl;Password=pyl;Unicode=True";

    DataSet myDs = new DataSet();

 

    protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {

            Get_CurveData();

        }

 

    }

    //获取数据

    public void Get_CurveData()

    {

        connection = new OracleConnection(strCon);

        DataSet ds = new DataSet();

        DataTable dt = new DataTable();

        try

        {

            string sqlStr = "SELECT 降雨量,降雨时间 FROM RAINFALL ORDER BY 降雨时间";

            command = new OracleCommand(sqlStr, connection);

            connection.Open();

            OracleDataAdapter da = new OracleDataAdapter(command);

            da.Fill(ds);

            dt = ds.Tables[0];

            connection.Close();

            draw(dt);

        }

        catch (Exception exp)

        {

            Response.Write(exp.Message);

        }

        finally

        {

            if (connection != null)

                connection.Close();

        }

}

//绘图

    public void draw(DataTable dt)

    {

        //取得记录数量

        int count = dt.Rows.Count;

        //记算图表宽度

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

        //设置最小宽度为800

        if (wd < 800) wd = 800;

        //生成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 = 300;

        //绘制底色

        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("降雨量(mm)", Tfont, brush, 5, 40);

        //绘制横坐标标题

        g.DrawString("降雨时间", Tfont, brush, 60 + xSpace * (count - 2), 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.ToString(dt.Rows[i]["降雨时间"]);

            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);

        }

        //定义曲线转折点

        Point[] p = new Point[count];

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

        {

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

            p[i].Y = Convert.ToInt32(dt.Rows[i]["降雨量"]);

//绘制记录点的降雨量

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

            //绘制记录点

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

        }

        //绘制折线图

        g.DrawLines(Rp, p);

 

        //保存绘制的图片

        MemoryStream stream = new MemoryStream();

        img.Save(stream, ImageFormat.Jpeg);

        //图片输出

        Response.Clear();

        Response.ContentType = "image/jpeg";

        Response.BinaryWrite(stream.ToArray());

    }

}

2 在网站上需要显示绘制好的图形的页面（defalt.aspx）上放置一个HTML控件：Image控件。

3 将该Image控件的src属性指定为上述第一步所建的aspx页面。即可完成在制定位置放置绘制的图形。

注意：如果要实现Image控件根据实时变换的条件更换时，只需要将该条件向绘制折线图的页面传递，然后再重新指定Image控件的SRC属性即可：

（1）在defalt.aspx.cs的Button的单击事件下：

Session["time"] = txttime.Text;

        img1.Src = "drawing.aspx";

（2）在drawing.aspx.cs的Page_Load下接收：

time = Session["time"].ToString ();

（3）变换原有SQL语句为动态：

string sqlStr = "SELECT 降雨量,降雨时间 FROM RAINFALL where 降雨时间>=to_date('" + time + "','yyyy-mm-dd HH24:MI:SS') ORDER BY 降雨时间";