ZedGraph图形控件在Web开发中的应用

简介: ZedGraph介绍:ZedGraph是一个功能强大图形控件,可以根据任意数据集创建2D曲线,bar,和pie图,同时我们既可以Windows Form中,也可以在ASP.NET Web Form中使用它。

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

}

效果图:

 ZedGraph图形控件在Web开发中的应用 - 太平凡 - 平凡人的博客

相关文章
|
18天前
|
开发框架 缓存 前端开发
基于SqlSugar的开发框架循序渐进介绍(23)-- Winform端管理系统中平滑增加对Web API对接的需求
基于SqlSugar的开发框架循序渐进介绍(23)-- Winform端管理系统中平滑增加对Web API对接的需求
|
20天前
|
安全 IDE 编译器
深入理解PHP 7的新特性及其对现代Web开发的影响
【7月更文挑战第30天】本文将深入探索PHP 7版本中引入的关键新特性,并分析这些改进如何优化现代Web开发实践。通过对比PHP 5和PHP 7的性能差异,我们将揭示PHP 7如何提升应用响应速度和资源利用效率。此外,本文还将讨论PHP 7对开发者工作流程的影响,包括新的语言特性、错误处理机制以及内置函数的增强,旨在为读者提供全面了解PHP 7所带来的变革性影响。
|
2天前
|
人工智能 自然语言处理 搜索推荐
【人工智能】人工智能(AI)、Web 3.0和元宇宙三者联系、应用及未来发展趋势的详细分析
人工智能(AI)、Web 3.0和元宇宙作为当前科技领域的热门话题,它们之间存在着紧密的联系,并在各自领域内展现出广泛的应用和未来的发展趋势。以下是对这三者联系、应用及未来发展趋势的详细分析
10 2
【人工智能】人工智能(AI)、Web 3.0和元宇宙三者联系、应用及未来发展趋势的详细分析
|
1天前
|
缓存 前端开发 JavaScript
高效开发现代 Web 应用:从前端到后端的最佳实践
在开发现代 Web 应用时,前端和后端技术的选择对项目的性能、可维护性和用户体验至关重要。本文将探讨如何通过现代工具和框架来优化前端和后端开发流程。我们将分析前端技术(如 React 和 Vue.js)与后端技术(如 Node.js 和 Django)的集成,并提供实际案例来展示如何实现高效开发。无论是对新手还是经验丰富的开发者,本指南都提供了宝贵的洞见和实用的技巧,以帮助提高开发效率并构建出色的 Web 应用。
|
3天前
|
人工智能 前端开发 开发工具
NET在企业级应用、Web开发、移动应用、云服务及游戏领域的创新实践
.NET技术自2000年推出以来,在软件开发领域扮演着关键角色。本文从核心优势出发,探讨其统一多语言平台、强大工具集、跨平台能力及丰富生态系统的价值;随后介绍.NET在企业级应用、Web开发、移动应用、云服务及游戏领域的创新实践;最后分析性能优化、容器化、AI集成等方面的挑战与机遇,展望.NET技术的未来发展与潜力。
10 2
|
5天前
|
开发框架 前端开发 JavaScript
C/S、B/S、Web的介绍(Web应用开发)
这篇文章介绍了C/S(客户端/服务器)和B/S(浏览器/服务器)两种架构,以及Web应用开发的基本原理、客户端和服务器端的应用技术。
C/S、B/S、Web的介绍(Web应用开发)
|
10天前
|
jenkins 持续交付 开发工具
"引爆效率革命!Docker+Jenkins+GIT+Tomcat:解锁持续集成魔法,一键部署Java Web应用的梦幻之旅!"
【8月更文挑战第9天】随着软件开发复杂度的增加,自动化变得至关重要。本文通过实例展示如何结合Docker、Jenkins、Git与Tomcat建立高效的持续集成(CI)流程。Docker确保应用环境一致性;Jenkins自动化处理构建、测试和部署;Git管理源代码版本;Tomcat部署Web应用。在Jenkins中配置Git插件并设置项目,集成Docker构建Tomcat应用镜像并运行容器。此外,通过自动化测试、代码质量检查、环境隔离和日志监控确保CI流程顺畅,从而显著提高开发效率和软件质量。
30 3
|
11天前
|
缓存 监控 前端开发
构建高性能Web应用的最佳实践
【8月更文挑战第8天】构建高性能的Web应用需要综合考虑多个方面,包括选择合适的技术栈、优化后端和前端性能、以及进行性能测试和监控。通过遵循这些最佳实践,开发者可以构建出高效、可扩展且用户友好的Web应用,提升用户体验和业务价值。
|
14天前
|
安全 前端开发 JavaScript
PHP在现代Web开发中的角色和挑战
【8月更文挑战第5天】随着技术的不断进步,PHP作为一门经典的服务器端脚本语言,在现代Web开发中扮演着重要角色。本文将探讨PHP的发展历程、它在当前Web开发环境中的地位、面临的主要挑战以及未来可能的发展方向。