javascript 報表框架總結

系統中第乙個報表框架是jfreecharts，這個框架使用起來也比較方便，但功能不是很強大，而且頁面（生成的）也不怎麼美觀（雖然可以盡力將其調至最佳狀態）。老總覺得這框架太醜陋，沒臉見人，讓我找找js的框架。

js框架頁面渲染能力比較出色，而且輕量易於使用和維護。在網上看了看，還真不少。比如時下流行的jscharts、fusioncharts(free/v3 eg),效果最炫的highcharts，當然還有搜尋巨頭google的jgcharts,jquery google charts，與prototype結合較為緊密的protochart、protovis等等。這些框架一開始還真讓人眼花繚亂了。

老總看到效果後第乙個選的就是highcharts,highcharts官方的文件寫的還真詳細（英文），做好後效果還真不錯。但瀏覽器跑著跑著就被卡住了。用sieve測試，記憶體洩露相當嚴重。偶滴個神啊，這東西還敢拿出來賣錢（雖說不貴，也就一百來塊錢，但總不能拿出來害人吧）。這個酷炫的東西就這樣被無形的扼殺了，不過還是希望highcharts在下個版本時將這個漏洞給補上。看了看其他的js報表工具，也有不少存在記憶體洩露的。我這裡就不一一枚舉了，有興趣的朋友可以自己試試。

無奈之下，只好有去看其他的框架，使用框架，穩定性是首要的，我的首選是jscharts，但jscharts沒有動態效果，而且還存在一些bug，比如中文亂碼的問題。中文亂碼現在應該不算是問題了，已經有人將這個問題給解決了。jscharts是將所有要展現的資訊統一繪圖，當然也包括標題，橫縱座標說明資訊等等。這樣一來，由於中文是沒法繪圖的，中文的顯示就成立一堆亂碼。以下是亂碼的解決方案，如果不太感興趣，可以略過不看。

2.頁面編碼設定為utf-8,最好在頁面頭部分將下面這句也加進去：

3.在生成乙個jschart例項之後緊跟著執行乙個函式patchmbstring()，如：

var mychart = new jschart('graph', 'pie');

mychart.patchmbstring();

//以下是設定字型樣式，不是必須的，可以自行選擇

mychart.setfontfamily("微軟雅黑");

mychart.setaxisvaluesfontsize(9);

mychart.setpieunitsfontsize(10);

下面說說我在系統中用的fusioncharts框架，這個框架生成的是flash檔案，所以動畫效果是很明顯的，最讓人欣慰的是，它不存在記憶體洩露的情況。

fusioncharts官方有示例，但沒有文件。我對此深感不爽。改個屬性都相當的麻煩，或許該去看看具體實現。

fusioncharts的使用其實也很簡單，按照給出的模板來，應該是很方便的，最讓我感到頭痛的是標題字型大小的改變。目前沒有找到直接相對應的屬性，只好採取一些折中的方式，比如整體字元調大，頁面調成適中的比率等。標籤中有個outcnvbasefontsize屬性，中有個fontsize屬性，兩相結合者調整。

/**
* fusioncharts
*/stringbuffer graphs=new stringbuffer(255);
if(rowkeys!=null&&rowkeys.length>0)
//新增資料
string  colors=;
for (int i = 0; i < colkeys.length; i++) 
}else
//新增資料
string  colors=new string ;
for (int i = 0; i < rowkeys.length; i++) 
}				
}		}
request.setattribute("graphs", graphs.tostring());

jsp頁面**如下：

fusioncharts.

javascript 報表框架總結

Javascript框架思想

Javascript框架思想

JavaScript框架思想3

javascript 報表框架總結

Javascript框架思想

Javascript框架思想

JavaScript框架思想3

相關推薦