fusioncharts在asp.net中的应用

来源:互联网 发布:原始原素 知乎 编辑:程序博客网 时间:2024/06/03 11:17

在开始学习这篇内容之前,你需要对fusioncharts有一定的了解,详情请见我另一篇博客手把手教你创建第一个fusioncharts

首先来描述一下整体思路:用ado.net连接数据库,读取table信息存在dataset中,拼接成一个字符串返回给前端,前台用AJAX拿到返回的字符串,用fusioncharts的setxmldata方法将数据画成图显示出来。

step1:在sql server management studio中新建一个表,命名为chart,酱婶儿的


step2:打开VS,新建一个asp.net WebForm项目。一个asp.net WebForm项目是由一个.aspx文件和一个.aspx.cs文件组成,前者是前端页面,后者存放后台逻辑。我们首先来写后台的代码,后台首先需要连接数据库,将chart表中的数据取出来放进dataset中,这里我是直接用DataAdapter填充Dataset,dataset拿到数据后就相当于数据已经放进缓存,可以将connection断掉了。代码如下:

 string connSQL = @"Data server;Initial Catalog= ;Integrated Security=True";            SqlConnection con = new SqlConnection(connSQL);            con.Open();            //Console.WriteLine("connect sucess!");            SqlDataAdapter da = new SqlDataAdapter("Select * From dbo.chart", con);            DataSet ds = new DataSet();            da.Fill(ds, "chart");            con.Close();            con.Dispose();

Dataset拿到数据之后,接下来我们把它拼接成符合fusioncharts解析格式的xml字符串,代码如下:

StringBuilder xmlData1 = new StringBuilder();            xmlData1.Append("");            for (int i = 0; i <= ds.Tables[0].Rows.Count - 1; i++)            {                xmlData1.AppendFormat("");            }                                 xmlData1.Append("");            return xmlData1.ToString();
这一步之后我们已经将数据库中的一张表变成了一个xml格式的字符串,下面就是前端页面来处理这个返回的结果。我将上述代码放到CreateCharts方法中,这里必须注意一点,这个方法必须定义成static的,而且要声明成webmethod,详情请参阅此篇博客:点击打开链接

step3:前端页面的处理

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="InfoSoftGlobal.WebForm4" %>My first chart using FusionCharts Suite XT          
直方图
添加FusionCharts的JS文件和JQuary的JS文件,这里一定要注意路径写对了,按照自己工程目录写。
 url: "WebForm4.aspx/CreateCharts"这里就是定位到后台代码的CreateCharts方法,拿到这个方法return的字符串
step4:F5运行,结果如下:


0 0
原创粉丝点击