</pre><p></p><p>以前JSP的项目中用到Fusionchart都是这样:</p><p>JSP页面中在要显示图表的地方写上这么一段:</p><p></p><pre code_snippet_id="117421" snippet_file_name="blog_20131218_1_6950141" class="java" name="code"> <td>
<%
String data = (String)request.getAttribute("measureEquipment");
String error = (String)request.getAttribute("error");
if(data != null){
%>
<div id="measure" align="center" ></div>
<script type="text/javascript">
var chart = new FusionCharts("charts/swf/MSColumn3D.swf", "measure", "1000", "350", "0", "0");
chart.setDataXML("<%=data%>");
chart.render("measure");
</script>
<%
}
if(error != null){
%>
<div align="center"><strong>没有符合条件的数据</strong></div>
<%} %>
</td>
点击按钮的时候,查询条件的form会提交到一个action,后台的action查询数据库,然后构造Fusionchart的XML,然后将构造好的XML写入到response,action的结果页面还是这个页面,所以这个页面重刷的时候就会显示出图表。
现在想在一个ASP.NET(其实我是用的FineUI,一个基于ExtJS+ASP.NET的控件库)项目中用Fusionchart,问题是ASP.NET是先执行后台的cs文件,然后再加载前台的aspx页面的,想要先加载完了页面,再点击一个按钮的时候,再查询数据库,显示出图表有点难度,除非点了按钮之后再次重刷界面。。。 肯定不好。
于是参考了Fusionchart的官方实例,发现全都是在cs文件中page_load()函数执行的时候,将XML数据返回给页面上的Literal控件:
<%@ Page Language="C#" AutoEventWireup="false" CodeFile="BasicDataXML.aspx.cs" Inherits="BasicExample_BasicDataXML" %>
<HTML>
<HEAD>
<TITLE>
FusionCharts Free - Simple Column 3D Chart using dataXML method
</TITLE>
</HEAD>
<BODY>
<asp:Literal ID="FCLiteral" runat="server"></asp:Literal>
</BODY>
</HTML>
protected void Page_Load(object sender, EventArgs e)
{
// Generate chart in Literal Control
strXML = CreateCharts();
FCLiteral.Text = FusionCharts.RenderChartHTML("../FusionCharts/FCF_Column3D.swf", "", strXML, "myNext", "600", "300", false);
}
但是这样不能实现我要的点击按钮显示图表啊,于是我试了试点击按钮的时候执行这段:
// Generate chart in Literal Control
strXML = CreateCharts();
FCLiteral.Text = FusionCharts.RenderChartHTML("../FusionCharts/FCF_Column3D.swf", "", strXML, "myNext", "600", "300", false);
这样不但不管用,甚至连整个页面都没办法显示了。
在pageload中绑定数据谁不会啊,我还会在页面上执行onReady()这个JS函数的之后绑定数据呢,像这样:
<div id="StackedColumn3D">StackedColumn3D</div>
<script type="text/javascript">
function OnReady()
{
var chart = new FusionCharts("chart/swf/StackedColumn3D.swf", "ChartId", "600", "300", "0", "0");
chart.setDataURL("chart/xml/StackedColumn3D.xml");
chart.render("StackedColumn3D");
}
</script>
=================================
继续想,想到既然页面加载的时候执行我这段JS代码是可以显示图表的,为何不能再点击按钮的时候,在后台(因为要访问数据库,所以必须是后台)调用执行我这段JS代码呢?
于是在网上搜索怎么在ASP.NET后台调用执行JS代码,试了下面两种方法:
Response.Write("<script type='text/javascript'>alert('ssssss');</script>");
ClientScript.RegisterStartupScript(this.Page.GetType(), "js", "Ceshi()", true);
还是不行啊,根本没反应,JS代码压根没执行,然后我觉得可能是我使用的框架是FineUI导致的,于是我又搜索怎么在FineUI中调用执行JS代码,像下面这样写之后终于成功了:
protected void Button1_Click(object sender, EventArgs e)
{
string ss = "var chart = new FusionCharts(\"chart/swf/MSColumn3D.swf\", \"StackedColumn3D\", \"1000\", \"350\", \"0\", \"0\"); "
+
"chart.setDataXML(\"" + GetChartXMLData() + "\"); " +
"chart.render(\"StackedColumn3D\"); ";
PageContext.RegisterStartupScript(ss);
}
点击统计按钮显示Fusionchart图表: