FusionChart使用教程：數據庫的動態數據交互

---

簡單介紹一下FusionCharts，這是一款動態的制作報表的工具，主要通過XML數據和SWF文件進行交互，實現類似于flash的非常漂亮的報表。下面就做一個Demo，簡要介紹一下啊FusionCharts的功能，以及如何實現一個完整動態數據的交互。 

下載FusionCharts的官方API發布包，我做這個例子的時候是V3.1下載后，在MyEclipse下新建一個Web工程。然后將發布包中的Charts文件夾拷貝到WebRoot下，這里面都是我們接下來要做圖的時候用到的一些swf文件。接著還需要一個JS文件，是JSClass文件夾下的FusionCharts.js文件，將它拷貝到WebRoot下的ChartsJs文件夾下。由于我這個項目是結合struts1還有spring加上JPA做的。所以大家先有個基本的認識。然后在WEB-INF下建立兩個目錄，一個叫fusion、一個叫common，等會我們會用到。找到發布包的\Code\JSP\Includes目錄下，將FusionCharts.jsp文件拷貝到common文件夾下。 

首先主要是展示2004、2005、2006、2007四年的一個油品的銷售統計，用柱狀圖來表示，然后點擊每一個柱子，會在右邊顯示出餅狀的上半年的各個月份的銷售比例。 

首先建立實體Bean，代碼如下：

Java代碼

Java代碼

這分別是年銷售統計和月銷售統計的實體Bean 

由于Service層的東西都在底層封裝好了，所以建立好表后，手動添加一些數據就好了。 

接下來是Action層的代碼，首先是針對年銷售突擊的Action的代碼

Java代碼：

這里的鉆取要用到ajax技術，所以接下來是月銷售統計的數據鉆取 

最后是頁面的代碼，struts1的配置我就不寫了，反正是定向到WEB-INF下的fusion下的 
year_units_report.jsp下，頁面代碼如下 ：

Java代碼：

最后圖的效果如下 

這樣就做到了動態數據交互鉆取，頁面不刷新。達到了預期的效果。