生成基于瀏覽器的圖表方式比較多。據(jù)我所知道的，常用的有三種：
1、
?????
VML
方式實(shí)現(xiàn)。這種方式是通過產(chǎn)生客戶端的代碼，由客戶端根據(jù)代碼生成相應(yīng)的圖表。但這種方式產(chǎn)生的圖表有很多的局限性，如受限于瀏覽器，有些瀏覽器可能并不支持
VML
。另外，沒有封裝完整的圖表開發(fā)包。
2、
?????
通過
applet
來產(chǎn)生圖表。這種方式也對客戶端要求比較高，必須要有
JRE
，而且通過
applet
生成的圖表在加載過程中會有個
Java
的
Log
動畫。用戶看了可能會感覺不太舒服。
3、
?????
通過服務(wù)端直接生成圖表的圖片。這種方式對客戶端幾乎沒有什么要求，缺點(diǎn)是加重了服務(wù)端的負(fù)擔(dān)，對服務(wù)端要求就相對高了點(diǎn)。
?
經(jīng)過比較，根據(jù)項(xiàng)目自身特點(diǎn)，我們打算采用第三種方式來開發(fā)圖表。為了縮短開發(fā)周期、節(jié)約成本，我們選用了開源的
JFreeChart
(
http://www.jfree.org/jfreechart/index.php
)
。
?
jfreechart
是一個免費(fèi)創(chuàng)建圖表的
java
工具，目前最新版本是
JFreeChart-1.0.0-rc1
。它可以生成各式各樣的圖表。這些圖表包括餅圖、柱狀圖、線形圖、區(qū)域圖、甘特圖等等，基本可以滿足各種項(xiàng)目的要求。但在開發(fā)過程中我也發(fā)現(xiàn)了
JFreeChart
的一些不足，或者說有些稱得上是
BUG
?？傮w說來，
JFreeChart
還是個優(yōu)秀的開源項(xiàng)目。
?
關(guān)于
JFreeChart
生成圖表的文章比較多了，我主要談?wù)勈褂?/span>
JFreeChart
的一些比較棘手問題以及解決方法。同時也會將問題所用到的源碼（
JFreeChart-1.0.0-rc1+Struts1.2.4
）從項(xiàng)目中抽象出來一起提供給大家。
?
一、
圖片上熱點(diǎn)鏈接中文亂碼的解決方法
?
這個問題是在我查閱關(guān)于
JFreeChart
相關(guān)資料時出現(xiàn)頻率最高的一個問題。其實(shí)這個亂碼問題不能怪罪于
JFreeChart
。有人甚至就因此認(rèn)為
JFreeChart
對中文支持不太完善，
JFreeChart
可要叫了：我是冤枉的！
?
我們來找出問題產(chǎn)生的原因，這個問題也就不難解決了。
?
首先查看一下出現(xiàn)問題頁面的
Html
源文件，你會發(fā)現(xiàn)在源文件的開頭多出了一段
map
代碼，代碼類似于這樣：
|
<map id="chart-30928.png" name="chart-30928.png">
<area shape="poly" coords="179,163,176,154,174,145" title="
洗衣機(jī)
=315(29.86%)" alt=""/>
…………
</map>
?
<html>
<head>
…………
|
這部分
map
代碼其實(shí)是
JFreeChart
產(chǎn)生的，是用來產(chǎn)生圖片上的熱點(diǎn)鏈接，這也是問題產(chǎn)生的根源所在。你的
Jsp
頁面通過
<%@ page contentType="text/html; charset=UTF-8" %>
或者
<%@ page contentType="text/html; charset=GBK" %>
來設(shè)置
contentType
這無可厚非，但
map
并不是由這個
jsp
頁面產(chǎn)生的。它是
JFreeChart
通過
PrintWriter
產(chǎn)生的。查看一下你生成圖片的
Chart
源碼，其中有
ChartUtilities.writeImageMap(pw, filename, info, false)
這樣的語句。這是用來向頁面寫入
map
代碼的。默認(rèn)情況下，
map
代碼會以服務(wù)器默認(rèn)編碼
(ISO-8859-1)
輸出。這就和你的
Jsp
編碼不一致，從而產(chǎn)生亂碼。
?
原因找到了，問題也就不難解決的。設(shè)置
PrintWriter
的
contentType
與
Jsp
的
contentType
保存一致就可以了。代碼如下（筆者的
Web
應(yīng)用是基于
Struts
框架的）：
|
//PieMothAciton.java
?
public ActionForward execute(ActionMapping mapping, ActionForm form,
?????????????? HttpServletRequest request, HttpServletResponse response)
?????????????? throws Exception {??????
???????
???????
//
設(shè)置輸出編碼格式
??????? response.setContentType("text/html;charset=UTF-8");
??????? PrintWriter out = response.getWriter();
???????
???????
…………
???????
??????? String filename = chart.generatePieChart3D("
月統(tǒng)計(jì)比例圖
",
????????????????????? session, out);
???????
??????? String graphURL = request.getContextPath()
????????????????????? + "/servlet/DisplayChart?filename=" + filename;
???????
??????? request.setAttribute("filename",filename);
??????? request.setAttribute("graphURL",graphURL);
???????
??????? return mapping.findForward(SUCCESS);???????????
}
|
重新部署你的
Web
應(yīng)用，中文亂碼文件就可以解決了。
?
二、
餅圖顯示百分比
?
在餅圖中
JFreeChart
默認(rèn)只顯示選項(xiàng)和數(shù)值，沒有顯示各項(xiàng)所占比例。由于手頭沒有
1.0
版的
JFreeChart Developer Guide
（這可是要錢的，后來想想即使有，也未必能找到關(guān)于百分比這方面的說明），再加上
DEMO
中的餅圖都沒有顯示百分比，無法參考。后來在網(wǎng)上找到了一個老版本的例子，其中能顯示百分比。它是通過在
PiePlot
中設(shè)置的：
|
PiePlot pie;
pie.setPercentFormatString("#,###0.0#%");
|
但
1.0
版本中根本就找不到
setPercentFormatString
這方法，
JFreeChart
各版本之間改動比較大，很難兼容。還好它是開源的，把它的源碼都搜索了一遍，認(rèn)真讀了一些源碼，終于理出了頭緒。
?
原來在
1.0.0-rc1
版中顯示百分比已經(jīng)調(diào)整到
StandardPieItemLabelGenerator
構(gòu)造函數(shù)中了，
StandardPieItemLabelGenerator
有三個構(gòu)造函數(shù)。
StandardPieItemLabelGenerator()
不顯示各項(xiàng)所占比例。另外兩個可以顯示比例。代碼如下：
?
|
plot.setLabelGenerator(new StandardPieItemLabelGenerator(StandardPieItemLabelGenerator.DEFAULT_TOOLTIP_FORMAT));
//
或者采用下面自定義樣式顯示，
{0}
表示選項(xiàng)，
{1}
表示數(shù)值，
{2}
表示所占比例
plot.setLegendLabelGenerator(new StandardPieItemLabelGenerator("{0}: ({1}M, {2})"));
|
效果如下圖：
?
默認(rèn)顯示百分比是取整的，如果要讓百分比保留二位小數(shù)，可以用第三個構(gòu)造函數(shù)：
|
plot.setLabelGenerator(new StandardPieItemLabelGenerator(“{0}={1}({2})”,
???????????????????????????? NumberFormat.getNumberInstance(),
???????????????????????????? new DecimalFormat("0.00%")));
|
效果如下圖：
?
三、
混合圖表（不同類型的圖混合顯示）
?
我們經(jīng)常用的是柱狀圖、曲線圖、和餅圖，這三類型圖基本能滿足大部分項(xiàng)目的需求。但有些項(xiàng)目比較特殊，可能需要在一張圖上同時顯示不同類型的圖。這在
JFreeChart
中可以輕松實(shí)現(xiàn)。例如我們要做個流量監(jiān)控的系統(tǒng)，該系統(tǒng)一天中在不同的時間段有不同的閥值（最大值），該閥值表示成階梯線。而實(shí)際流量就是個曲線了。當(dāng)流量在某個時段內(nèi)超過閥值時就觸發(fā)相應(yīng)的事件（如限流）。要表示閥值和流量的對比關(guān)系就需要兩種類型的圖片在同一張圖表上表示，如下圖：
?
首先像創(chuàng)建普通圖表一樣來創(chuàng)建圖片，筆者先創(chuàng)建了一個
XYStep Chart
。然后創(chuàng)建第二圖表的
Renderer
，再分別將第二圖表的
Dataset
、
Renderer
添加進(jìn)第一圖表的
plot
。實(shí)例代碼如下：
|
//MultipleChart.java
?
JFreeChart jfreechart = ChartFactory.createXYStepAreaChart("
監(jiān)控設(shè)置
",
???????
??????? "
時刻
",
???????
??????? "
流量
",
???????
??????? xydataset,
???????
??????? PlotOrientation.VERTICAL,
???????
??????? true,
???????
??????? true,
???????
??????? false);
???????
??????? XYPlot xyplot = jfreechart.getXYPlot();
?
…………
?
??????? //
設(shè)置第二圖表的
Renderer
???????
StandardXYItemRenderer standardxyitemrenderer = new StandardXYItemRenderer();
??????? standardxyitemrenderer.setToolTipGenerator(new StandardXYToolTipGenerator("{0}({1}) = {2}",
???????
??????? new SimpleDateFormat("HH:mm"),
???????
??????? new DecimalFormat("#,##0")));
???????
???????
??????? //
將第二圖表的
Dataset
、
Renderer
添加進(jìn)
xyplot
???????
xyplot.setDataset(1, lineDataset);
??????? xyplot.setRenderer(1,standardxyitemrenderer);?
?
|
這樣就創(chuàng)建了曲線和階梯的混合圖表。
?
四、
其它問題
?
1)
?
版本問題。
JFreeChart
的各版本變動比較大，這在升級版本時是比較頭疼的問題，升級時需要改動你代碼的地方可能比較多。因此盡量采用最新的版本，新版本的文檔可能比較少，但問題要相對少一些，在舊版中就出現(xiàn)過標(biāo)注數(shù)值重疊在一起這樣的問題。好的是
JFreeChart
是開源的，碰到解決不了的問題可以從源碼中找到有參考價值的信息。
?
2)
?
設(shè)置背景透明度的
BUG
不知道這是不是
JFreeChart
的一個
BUG
。利用
chart.setBackgroundImageAlpha(0.5f)
來設(shè)置背景透明度，
ServletUtilities.saveChartAsPNG
保存圖片。將
chart.setBackgroundImageAlpha(0.5f)
注釋掉再生成圖片，發(fā)現(xiàn)兩張圖片是一樣的。也就是說
setBackgroundImageAlpha
方法無效，具體原因筆者還不太清楚，讀者大家可以自己測試看看。