一、引言
項目組中，經常會因為繪制圖表的繁雜度，衡量會不會使用第三方繪圖工具，如果自己做很困難，成本使用高於第三方繪圖工具庫，就會使用。很多人使用的是Chart.js，因為它是免費使用的，不過，缺點就是只提供了八種統計圖表，而FusionChart.js雖然是收費的，但一年也只是一千多元，相對較復雜的繪制圖標，使用這個繪圖工具庫，要比幾個人用幾個星期來做，要更划算一些。
二、FusionCharts.js
- 融合圖表
- 既可以用在Web上，也可以用在手機端
- 擁有最全的統計圖，90+統計圖表，1000+地圖
三、使用方法
- 引入兩個關鍵js文件：FusionCharts.js和FusionCharts.Chart.js
注意：這兩個js文件一定要放在jquery.js基礎js文件之后，頁面自己的js文件之前（比如：usercenter.js）,因為最后自己的js文件中的方法要用到這兩個文件。
- html頁面中不需要構建SVG，只要創建div就行。
<div id="container-buystat-svg"> 此處應該呈現一個SVG的統計圖... </div>
- 在js中新建一個圖表對象（一般動態加載的數據，要放在ajax異步請求數據的success方法中）
//異步請求“消費統計”數據，繪制ＳＶＧ統計圖
$.ajax({ type:'GET', url:'/uc/buyStat', data:{uid:sessionStorage['loginUid']}, success:function(list){ var c = new FusionCharts({ type:'column3d',//統計圖表類型
renderAt:'container-buystat-svg',//畫在哪里--div的id
width:'800', height:'600', dataSource:{data:list} }); c.render();//把圖表渲染到DOM樹上
} });
以上都是必要的數據和方法，還有一些特別的選項，可以自己去查找手冊，在合適的地方，也可以自由選擇。
三、繪制效果
四、圖表分類（主要的幾種）
| column2d（2d縱向圖表） |
column3d（3d縱向圖表） |
 |
 |
| bar2d（2d橫向圖表） |
bar3d（3d橫向圖表） |
 |
 |
| line（折線圖） | pie2d（2d大餅圖） |
 |
 |
| pie3d（3d大餅圖） | doughnut2d（2d面包圈） |
 |
 |
注：轉載請注明出處