FusionCharts工作原理

最新推荐文章于 2024-08-09 17:59:00 发布

voosworld

最新推荐文章于 2024-08-09 17:59:00 发布

阅读量812

点赞数

文章标签：工作 xml 报表 javascript 服务器 url

本文链接：https://blog.csdn.net/voosworld/article/details/5304799

版权

J2EE企业级开发，简单的说，就是对数据的操作，让客户更为直观的分析数据和公司运营。我这里说的不是J2EE的概念，只是一个小方面概括。报表在项目开发中占有一定的地位，它较为直观的向客户传送些许明快的信息。

使用这个组件，还是其他牛人向我推荐的。通过Demo：http://www.fusioncharts.com/Demos/Blueprint/观看例子，所以我决定首先研究它。入门还是很简单的。为了更好的学习FusionCharts在JSP上的使用，我不得不首先研究下 FusionCharts的工作原理。

使用FusionCharts进行绘制报表最重要的环节就是如何把XML数据传送给FusionCharts。XML数据可以是静态的，也可以是与服务器端进行交互的动态XML数据。今天我们探索的是XML数据传向FusionCharts三种方法：

1. dataURL 方法

在这种方法中，你只需把XML数据文件的URL提供给FusionCharts。根据提供的URL找到XML数据文件进行全读和分析，最后相应的返回报表视图。

2. dataXML 方法

发送XML数据会和HTML、SWF文件一起进行浏览。SWF会被下载和全读所有的数据，然后返回报表视图。

3. JavaScript 方法

这个方法，你只需要利用JavaScript函数把XML数据传送给FusionCharts就可以了。

补记:FusionCharts V3 提供了一种更加完美的方法，XML数据通过类似AJAX方法进行刷新，而报表视图页面无需刷新。

FusionCharts最新的免费版本是2.2，商业版本已经达到3.0，提供更多新的更加简单的功能和方法。但是，免费的版本已经足以实现我们所需的报表样式。

下面我们接着讨论下这几种方法的不同之处。

dataURL 方法：

在这种方法中，你需要把XML数据文件的URL准确的提供给FusionCharts。根据提供的URL对XML数据发送请求，进行全读和分析，最后返回报表视图。下面这张图片会帮助你理解这个方法的流程：

纵观上图,有三个步骤：

1. 首先，把HTML和SWF文件发送到视图浏览端。和SWF一起，你也会告知数据是从哪里摘下来的。URL会指向你的服务器端的脚本。同时，SWF也会下载到视图端，它会根据URL为XML数据文件发送一个请求。

2. 现在你的服务器端脚本就在这个URL上

接收传递过来的参数

处理它们

与数据库打交道【服务器端也会利用表单或者数组作为数据源】

从像Recordsets,Data Readers等本地对象得到数据

使用XML DOM 处理这些数据使之符合规范

最终把这些数据以流的形式输出

3.FusionCharts 现在接收XML数据，分析它并最终制出报表。

更简单的说，如果想实现FusionCharts报表，仅仅需要以下三步：

第一步：报表所显示的页面；这个页面可以是HTML,也可以是其他的页面格式，比如ASP,JSP等等。在这个页面上不仅仅展示报表视图，也要包含指向XML数据文件的URL；

第二步：SWF文件；

第三步：数据文件；免费版本提供的就只有XML格式的数据文件读取方法。

下面是代码的例子，更为直观；

简单使用dataURL方法利用JavaScript从预备的XML文档中接收数据：

<div id="chart1div">
   This text is replaced by the chart.
</div>
<script type="text/javascript">
   var chart1 = new FusionCharts("Column2D.swf", "ChId1", "600", "400", "0", "0");
   chart1.setDataURL("Data.xml");
   chart1.render("chart1div");
</script>

由于时间仓促等其他原因，中间稍有省略，请见谅！

简单试用dataURL方法直接在HTML隐藏从预备好的XML文档中接收的数据。

简单试用dataURL方法直接利用HTML隐藏从服务器端脚本作为数据的提供

小结：dataURL方法是被推荐的，它不会限制XML数据的大小。另外，如果你使用特别的字符（比如，UTF-8或者其他的双字节的字符）在你的XML文件中，你必须使用这个方法。

声明：以上是我根据FusionCharts英文文档简单翻译的文章，难免出现词义不准确，语句不通顺等问题，请谅解。我会在以后的时间里慢慢订正，已达到更加完美的境界，年后回到工作岗位上我会利用业余时间把现在困难的问题（比如把FusionCharts整合到实际项目中）全部解决，并与你们分享。如果您有什么建议和补充，请联系我，QQ：812273181。

voosworld

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
FusionCharts工作原理

J2EE企业级开发，简单的说，就是对数据的操作，让客户更为直观的分析数据和公司运营。我这里说的不是J2EE的概念，只是一个小方面概括。报表在项目开发中占有一定的地位，它较为直观的向客户传送些许明快的信息。使用这个组件，还是其他牛人向我推荐的。通过Demo：http://www.fusioncharts.com/Demos/Blueprint/观看例子，所以我决定首先研究它。入门还是很简单的。
复制链接

扫一扫