ZedGraph介绍:
ZedGraph是一个功能强大图形控件,可以根据任意数据集创建2D曲线,bar,和pie图,同时我们既可以Windows Form中,也可以在ASP.NET Web Form中使用它。ZedGraph具有高度的灵活性,我们几乎可以定制图形的每个方面,同时又为所有的特性提供了默认值,因此可以快速上手。ZedGraph与.NET 2.0和Visual Studio 2005兼容。
ZedGraph在web中的应用:
zedgraph是一个开源免费项目,其官方网http://zedgraph.org/wiki/index.php?title=Main_Page
zedgraph中有两个命名空间--------ZedGraph和ZedGraph.Web。
ZedGraph 命名空间包含整个ZedGraph的类,加上一个ZedGraphControl控件(用于WinForm开发用的UI控件)。
ZedGraph.Web命名空间包含用于web开发的组件,加上一个ZedGraphWeb控件(用于web开发的UI控件)。
当只开发WinForm程序时,可以只添加引用ZedGraph命名空间对应的ZedGraph.dll。并可以在工具箱中,用 “选择项”把ZedGraphControl控件当成工具添加到工具箱中,这时就可以像其他(如button)一样,直接从工具箱中拖拉出来。
当开发web程序时,就要添加引用ZedGraph.dll和ZedGraph.Web.dll。并也可在工具箱中,把ZedGraphWeb控件添加到工具箱。
现在讲关于zedgraph 在web中的应用:
ZedGraphWeb.RenderMode有两种模式:ImageTag和RawImage。
ImageTag:这是用的比较多的。此时,把zedgraph作为一个正常控件使用。它的每一次请求,都会先生成图片,缓存在服务器上的一个指定文件夹下(这些图片,在客户端关闭浏览器,缓存时间到时,自动删除),接着自动产生一个<img srl="">标签,放在原来ZedGraphWeb在网页中的位置。img的src指向缓存在指定文件夹下的图片的地址,并加上time属性,以骗取浏览器重新加载图片。默认情况下,我们需要在应用程序的根目录下,指定一个ZedGraphImages的文件夹来存放缓存图片,大家也可修改ZedGraphWeb的
Height:300
Width: 400
RenderedImagePath: ~/ZedGraphImages/ (这个属性可以自己设置路径)
ChartFill.Color: Black
ChartFill.Type: Solid
TmpImageDuration: 0 (注意这里的单位是小时,如果不小心会在服务器端产生很多的垃圾文件)
这是利用Visual Studio属性面板对ZedGraph控件进行设置
在解决方案浏览器中右击项目,选择New Folder,命名为ZedGraphImages,ZedGraph使用此文件夹存放呈现到客户端的图片,必须添加这个文件夹。
绘制图形:
命名空间应用:
aspx.cs文件中
using ZedGraph.Web;
using System.Data.SqlClient;
aspx文件中
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default9.aspx.cs" Inherits="Default9" Theme=""%>
<%@ Register TagPrefix="zgw" Namespace="ZedGraph.Web" Assembly="ZedGraph.Web" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
</head>
<body>
<form id="form1" runat="server">
<ZGW:ZEDGRAPHWEB runat="server"
Width="900" Height="500" OnRenderGraph="OnRenderGraph" RenderedImagePath="~/image/" TmpImageDuration="0.01">
</ZGW:ZEDGRAPHWEB>
</form>
</body>
</html>
在aspx.cs文件里添加ZedGraph的事件代码OnRenderGraph:
protected void OnRenderGraph(ZedGraphWeb webObject, Graphics g, MasterPane masterPane)
{
GraphPane myPane = masterPane[0];
string[] labels = null;
myPane.Title.Text = "";//报表名称
myPane.XAxis.Title.Text = "";//横坐标的名称
myPane.YAxis.Title.Text = "";//纵坐标的名称
SqlConnection myConnection = new SqlConnection(ConfigurationManager.AppSettings["ConnectionString"]);
//获取数据库中的数据
SqlDataAdapter myDataAdapter = new SqlDataAdapter("select * from RealDate", myConnection);
DataSet myDs = new DataSet();
myDataAdapter.Fill(myDs, "RealDate");
int iCount = myDs.Tables["RealDate"].Rows.Count;
double[] y = new double[iCount];
string s = string.Empty;
for (int i = 0; i < iCount; i++)
{
DateTime sTime = Convert.ToDateTime(myDs.Tables["RealDate"].Rows[i][0].ToString());
s += sTime.ToString("hh:mm:ss") + ";";
y[i] = Convert.ToDouble(myDs.Tables["RealDate"].Rows[i][1].ToString());
}
labels = s.Split(';');
LineItem myCurve = myPane.AddCurve("监测值", null, y, Color.Red, SymbolType.Circle);
myCurve.Line.IsSmooth = true;
myPane.XAxis.Type = AxisType.Text;
myPane.XAxis.Scale.TextLabels = labels;
myPane.XAxis.Scale.FontSpec.Size = 7;
myCurve.Line.Width = 1.5F;
myCurve.Symbol.Fill = new Fill(Color.White);
myCurve.Symbol.Size = 5;
myPane.XAxis.Scale.BaseTic = 0;
myPane.Chart.Fill = new Fill(Color.White, Color.SteelBlue, 45.0F);
const double offset = 0.001;
for (int i = 0; i < iCount; i++)
{
PointPair pt = myCurve.Points[i];
TextObj text = new TextObj(pt.Y.ToString(), pt.X, pt.Y + offset, CoordType.AxisXYScale, AlignH.Left, AlignV.Center);
text.ZOrder = ZOrder.A_InFront;
text.FontSpec.Border.IsVisible = false;
text.FontSpec.Fill.IsVisible = false;
text.FontSpec.Fill = new Fill(Color.FromArgb(100, Color.White));
text.FontSpec.Angle = 90;
myPane.GraphObjList.Add(text);
}
myPane.YAxis.Scale.MaxGrace = 0.2;
masterPane.AxisChange(g);
}
效果图: