FusionCharts使用
FusionCharts是一个很好的嵌入网页表格工具,下面介绍一下在php和java中的使用。首先在下载FusionCharts.
下载完成后解压目录结构如下:
环境搭建
启动php服务器我使用的是ComsenzEXP,把解压后的FusionCharts_Evaluation文件夹拷贝到php发布的跟目录wwwroot下面ok部署完成了,什么这么快?哈哈就是这么简单。接下来可以试一下访问:
http://localhost/FusionCharts_Evaluation/index.html
把loaclhost修改为你的服务器ip(后面的url一样),这个页面可以预览FusionCharts工具概貌。
php的代码中code文件夹下面,尝试访问下面url
http://localhost/FusionCharts_Evaluation/Code/PHP/BasicExample/MultiChart.php
是不是能显示出了图的效果了?
代码解析
下面是MultiChart.php代码:
<?php
//We've included ../Includes/FusionCharts.php, which contains functions
//to help us easily embed the charts.
include("../Includes/FusionCharts.php");
?>
<HTML>
<HEAD>
<TITLE>
FusionCharts - Multiple Charts on one Page
</TITLE>
<?php
//You need to include the following JS file, if you intend to embed the chart using JavaScript.
//Embedding using JavaScripts avoids the "Click to Activate..." issue in Internet Explorer
//When you make your own charts, make sure that the path to this JS file is correct. Else, you would get JavaScript errors.
?>
<SCRIPT LANGUAGE="Javascript" SRC="../../FusionCharts/FusionCharts.js"></SCRIPT>
<style type="text/css">
<!--
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
-->
</style>
</HEAD>
<BODY>
<CENTER>
<h2>FusionCharts Examples</h2>
<h4>Multiple Charts on the same page. Each chart has a unique ID.</h4>
<?php
//This page demonstrates how you can show multiple charts on the same page.
//For this example, all the charts use the pre-built Data.xml (contained in /Data/ folder)
//However, you can very easily change the data source for any chart.
//IMPORTANT NOTE: Each chart necessarily needs to have a unique ID on the page.
//If you do not provide a unique Id, only the last chart might be visible.
//Here, we've used the ID chart1, chart2 and chart3 for the 3 charts on page.
//Create the chart - Column 3D Chart with data from Data/Data.xml
echo renderChart("../../FusionCharts/Column3D.swf", "Data/Data.xml", "", "chart1", 600, 300, false, false);
?>
<BR><BR>
<?php
//Now, create a Column 2D Chart
echo renderChart("../../FusionCharts/Column2D.swf", "Data/Data.xml", "", "chart2", 600, 300, false, false);
?>
<BR><BR>
<?php
//Now, create a Line 2D Chart
echo renderChart("../../FusionCharts/Line.swf", "Data/Data.xml", "", "chart3", 600, 300, false, false);
?>
<BR><BR>
<a href='../NoChart.html' target="_blank">Unable to see the charts above?</a>
</CENTER>
</BODY>
</HTML>
从代码中发现三点:
1. 每个表格的图像信息保存在swf文件中,通过改变swf文件可以显示不同的表格。
2. 表格数据存放在Data文件夹下面的Data.xml中,自己打开看看里面的数据是不是很整齐?
3. 另外这个工具的数据不只是可以支持xml格式的数据,还可以支持数组/DB等(不忽悠),支持数字的例子在ArrayExample里面聪明的你自己尝试运行一下。
在code中还发现可以支持其他的语言jsp/asp等,我运行过jsp的是可以的(不过需要自己建立个java的web应用)在这里就不赘述了。另外在项目部署的时候只需要拷贝其中我们用的的文件即可不需要全部拷贝的服务器目录下。