利用JFreeChart在JSP中制作圖表

摘 要： 圖表的應(yīng)用不但可以使數(shù)據(jù)的顯示更加清晰、直觀，而且可大大增強(qiáng)Web頁面的功能和顯示效果。針對(duì)目前實(shí)際應(yīng)用中經(jīng)常需要通過數(shù)據(jù)庫中的數(shù)據(jù)生成相應(yīng)的圖表這一強(qiáng)大需求，介紹了JFreeChart中通過其提供的數(shù)據(jù)集合對(duì)象在JSP頁面中生成圖表的方法，并給出了生成餅圖和柱狀圖的具體方法和代碼。

關(guān)鍵詞： JFreeChart； JSP； Web； 圖表

中圖分類號(hào)：TP311.1 文獻(xiàn)標(biāo)志碼：A 文章編號(hào)：1006-8228（2013）04-34-03

Generating charts in JSP by using JFreeChart

Zhang Yuye1， Ma Chunqing2

（1. Dept. of computer， Jinan Vocational Colleage， Jinan， Shandong 250014， China； 2. Jinan Information Engineering School）

Abstract： Using charts can not only make data be clearer， more intuitive， but also greatly enhance the Web page and display effects. Aiming at the strong request to generate corresponding charts through data in database in practical applications， a method to generate charts in JSP pages through the data set object supplied by JFreeChart is introduced. The concrete realization method and code of the pie chart and histogram are given.

Key words： JFreeChart； JSP； Web； chart

0 引言

在日常統(tǒng)計(jì)報(bào)表中我們經(jīng)常需要用到各種圖表，這些圖表可以讓我們更加清晰直觀地看到數(shù)據(jù)的各種分布情況。EXCEL中提供了強(qiáng)大的圖表功能，利用這些功能我們可以輕松快捷地制作出所需的各種圖表。現(xiàn)在隨著網(wǎng)絡(luò)辦公及無紙化辦公的廣泛應(yīng)用，人們也需要在網(wǎng)頁中能夠提供類似EXCEL中的圖表功能，能以圖表的形式來清晰直觀地顯示統(tǒng)計(jì)報(bào)表中的各種數(shù)據(jù)。JFreeChart是Java平臺(tái)上的一個(gè)開放的圖表繪制類庫，它完全使用Java語言編寫，可應(yīng)用于Java Applications、Applets、Servlets和JSP等。利用JFreeChart可生成餅圖、柱狀圖、折線圖、時(shí)序圖、散點(diǎn)圖、甘特圖等平時(shí)所需的多種圖表，并且可以產(chǎn)生PNG和JPEG格式的兩種輸出[1]，利用JSP可以很方便地獲取到生成的圖片，并在網(wǎng)頁中顯示。目前一些介紹JFreeChart使用的多是通過臨時(shí)添加一些數(shù)據(jù)來演示[2-4]，而實(shí)際應(yīng)用中圖表的數(shù)據(jù)通常來自于數(shù)據(jù)庫，關(guān)于如何獲取數(shù)據(jù)庫中的數(shù)據(jù)生成圖表介紹的相對(duì)較少，事實(shí)上這部分內(nèi)容才是比較實(shí)用的。基于此，通過查閱各種參考文獻(xiàn)[5-7]和JFreeChart本身的開發(fā)文檔，本文以一個(gè)職工情況表為例，通過創(chuàng)建其各種職稱的分布情況的餅圖和柱狀圖，詳細(xì)介紹了在JSP中如何利用JFreeChart通過數(shù)據(jù)庫中的數(shù)據(jù)生成相應(yīng)的圖表。

1 數(shù)據(jù)源

統(tǒng)計(jì)報(bào)表中的數(shù)據(jù)通常來自于數(shù)據(jù)庫。本文用的示例數(shù)據(jù)庫OAJSP中有一“職工情況表”，如表1所示。

現(xiàn)要統(tǒng)計(jì)其各種職稱的人數(shù)。職稱人數(shù)在表中并沒有直接體現(xiàn)出來，但通過一定的計(jì)算可以求出，像這種報(bào)表中數(shù)據(jù)不是直接來自于表中數(shù)據(jù)，而是需要經(jīng)過計(jì)算得出的，最好是在數(shù)據(jù)庫中先建立相應(yīng)的視圖，然后再對(duì)視圖進(jìn)行操作，這樣操作相對(duì)簡(jiǎn)便。對(duì)表1根據(jù)職稱建好的視圖（在此將生成的視圖命名為“職稱統(tǒng)計(jì)報(bào)表”）如表2所示。接下來就相當(dāng)于直接對(duì)“職稱統(tǒng)計(jì)報(bào)表”這個(gè)虛擬表（視圖）進(jìn)行操作。

2 開發(fā)環(huán)境

本文示例所采用的開發(fā)工具：MyEclipse 8.6，JDK：1.6；數(shù)據(jù)庫：Oracle 10g；JFreeChart：版本1.0.6。有些高版本的JFreeChart不能很好地支持中文，為了更好地支持中文，本文采用的是1.0.6版本。服務(wù)器：利用MyEclipse自帶的Tomcat。

開發(fā)前準(zhǔn)備：要在JSP中使用JFreeChart，應(yīng)先根據(jù)需要下載其相應(yīng)版本的軟件，然后將其解壓到本地硬盤上。

導(dǎo)入相應(yīng)的Jar包：將解壓后的JFreeChart1.0.6中l(wèi)ib目錄下的三個(gè)jar包：jfreechart-1.0.6.jar、gnujaxp.jar和jcommon-1.0.10.jar導(dǎo)入到當(dāng)前工程的lib目錄下。

配置web.xml：JFreeChart生成的圖片應(yīng)用于JSP時(shí)通常要利用其本身提供的Servlet文件，該Servlet文件在JFreeChart組件包中，使用時(shí)要將其配置到相應(yīng)的web.xml文件中，配置方法如下：

DisplayChart

org.jfree.chart.servlet.DisplayChart

DisplayChart

/DisplayChart

3 圖表的建立

在JSP中利用JFreeChart生成圖表，通常分為三個(gè)步驟。

⑴ 建立數(shù)據(jù)集。數(shù)據(jù)集通常來自于數(shù)據(jù)庫，需要對(duì)數(shù)據(jù)庫進(jìn)行操作來獲取所需數(shù)據(jù)。JFreeChart組件對(duì)這一過程進(jìn)行了封裝，通過自定義的SQL語句即可獲取到已封裝好的數(shù)據(jù)集合對(duì)象。JfreeChart中常用的JDBC數(shù)據(jù)集合對(duì)象有3種，分別為JDBCCategoryDataset（JDBC填充類別數(shù)據(jù)集合）、JDBCPieDataset（JDBC填充餅形圖數(shù)據(jù)集合）、JDBCXYDataset（JDBC填充坐標(biāo)軸數(shù)據(jù)集合）。

⑵ 創(chuàng)建JfreeChart對(duì)象。通常通過制圖工廠JfreeChartFactory提供的相對(duì)應(yīng)的各種方法來創(chuàng)建各種圖表對(duì)象。

⑶ 獲取圖片。獲取生成的圖片，在JSP頁面中顯示。

3.1 餅圖的建立

“職工情況表”中各種職稱的統(tǒng)計(jì)人數(shù)已經(jīng)建立了相應(yīng)的視圖“職稱統(tǒng)計(jì)報(bào)表”，因此接下來就相當(dāng)于直接對(duì)虛擬表“職稱統(tǒng)計(jì)報(bào)表”進(jìn)行操作，也即餅圖的數(shù)據(jù)來源就是視圖“職稱統(tǒng)計(jì)報(bào)表”中的數(shù)據(jù)。

⑴ 建立數(shù)據(jù)集及創(chuàng)建圖表對(duì)象。在當(dāng)前工程（在此設(shè)工程名為OAJSP1）的src目錄中新建一類文件PieChartUtil.java，用于與數(shù)據(jù)庫建立連接并取得職稱統(tǒng)計(jì)報(bào)表中的數(shù)據(jù)，同時(shí)根據(jù)數(shù)據(jù)集中的數(shù)據(jù)生成餅圖，代碼如下：

package db；

import java.awt.Font；

import java.text.NumberFormat；

import org.jfree.chart.ChartFactory；

import org.jfree.chart.JFreeChart；

import org.jfree.chart.labels.StandardPieSectionLabelGenerator；

import org.jfree.chart.plot.PiePlot；

import org.jfree.data.general.PieDataset；

import org.jfree.data.jdbc.JDBCPieDataset；

public class PieChartUtil {

public static PieDataset initPieData（） {

String driverName=\"oracle.jdbc.driver.OracleDriver\"；

//數(shù)據(jù)庫驅(qū)動(dòng)

String url=\"jdbc：oracle：thin：@localhost：1521：XE\"；

//數(shù)據(jù)庫連接URL

String user=\"oajsp\"； //數(shù)據(jù)庫用戶名

String password=\"111111\"； //數(shù)據(jù)庫密碼

JDBCPieDataset dataset=1；

try { //通過JDBC創(chuàng)建數(shù)據(jù)集合

dataset=new JDBCPieDataset（url，driverName， user，

password）；

String query=\"select 職稱，人數(shù) from職稱統(tǒng)計(jì)報(bào)表\"；

//SQL語句

dataset.executeQuery（query）； //查詢并向數(shù)據(jù)集合中添加

數(shù)據(jù) dataset.close（）； //關(guān)閉數(shù)據(jù)庫連接

} catch （Exception e） {

e.printStackTrace（）； }

return dataset； }

public static JFreeChart createChart（） { //創(chuàng)建餅圖

JFreeChart chart=ChartFactory.createPieChart（\"職稱人數(shù)統(tǒng)

計(jì)\"，initPieData（），true，true，1）；

//參數(shù)分別表示圖表標(biāo)題，數(shù)據(jù)集對(duì)象，是否顯示圖例，是否顯示提示文本，是否生成超鏈接

chart.getTitle（）.setFont（new Font（\"隸書\"，F(xiàn)ont.BOLD，25））；

//設(shè)置標(biāo)題字體

chart.getLegend（）.setItemFont（new Font（\"宋體\"，F(xiàn)ont.BOLD，

15））； //設(shè)置圖例類別字體

PiePlot plot = （PiePlot） chart.getPlot（）； //獲取繪圖區(qū)對(duì)象

plot.setForegroundAlpha（0.5f）； //設(shè)置前景透明度

plot.setLabelFont（new Font（\"宋體\"，F(xiàn)ont.PLAIN，12））；

//設(shè)置分類標(biāo)簽的字體

plot.setCircular（true）； //設(shè)置餅形為正圓

plot.setLabelGenerator（new StandardPieSectionLabelGenerator（\"{0}={2}\"，

NumberFormat.getNumberInstance（）， NumberFormat

.getPercentInstance（）））；

//設(shè)置分類標(biāo)簽格式為類別名稱及其所占百分比

return chart； } }

⑵ 在JSP中獲取生成的圖片。在OAJSP1工程Webroot目錄中新建一JSP文件（設(shè)文件名為pie.jsp），其代碼如下：

<%@ page language=\"java\" import=\"java.util.*\" pageEncoding

=\"GB2312\"%>

<%@ page import=\"org.jfree.chart.servlet.ServletUtilities，

db.PieChartUtil\"%>

<% String path=request.getContextPath（）；

String basePath=request.getScheme（）+\"：//\"+request

.getServerName（）+\"：\"+request.getServerPort（）+path+\"/\"；%>

<！DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01

Transitional//EN\">

\">

<% String fileName=ServletUtilities.saveChartAsJPEG

（PieChartUtil.createChart（），500，300，session）；

String graphURL=request.getContextPath（）

+\"/DisplayChart？filename=\"+fileName； %>

border=\"1\">

⑶ 啟動(dòng)tomcat服務(wù)器，在瀏覽器中輸入http：//localhost：8080/OAJSP1/pie.jsp，瀏覽相應(yīng)的JSP文件，運(yùn)行結(jié)果如圖1所示。

3.2 柱狀圖的建立

柱狀圖的建立過程與餅圖的建立過程大體相同。所不同的是建立餅圖用的是JDBCPieDataset數(shù)據(jù)集合，建立柱狀圖用的是JDBCCategoryDataset數(shù)據(jù)集合，不同的數(shù)據(jù)集合放在不同的包中，要根據(jù)需要引入所需的包。還有生成的餅圖和柱狀圖所需要進(jìn)行的設(shè)置稍有不同，根據(jù)需要做相應(yīng)的調(diào)整，最后在JSP頁面中要根據(jù)需要引入對(duì)應(yīng)的類。具體步驟如下。

⑴ 建立數(shù)據(jù)集及創(chuàng)建圖表對(duì)象。在當(dāng)前工程OAJSP1的src目錄中新建一類文件BarChartUtil.java，用于與數(shù)據(jù)庫建立連接并取得職稱統(tǒng)計(jì)報(bào)表中的數(shù)據(jù)，同時(shí)根據(jù)數(shù)據(jù)集中的數(shù)據(jù)生成柱狀圖，代碼如下：

package db；

import java.awt.Color；

import org.jfree.chart.ChartFactory；

import org.jfree.chart.JFreeChart；

import org.jfree.chart.labels.StandardCategoryItemLabelGenerator；

import org.jfree.chart.plot.CategoryPlot；

import org.jfree.chart.plot.PlotOrientation；

import org.jfree.chart.renderer.category.BarRenderer；

import org.jfree.data.category.CategoryDataset；

import org.jfree.data.jdbc.JDBCCategoryDataset；

public class BarChartUtil {

public static CategoryDataset initCategoryData（） {

String driverName=\"oracle.jdbc.driver.OracleDriver\"；

//數(shù)據(jù)庫驅(qū)動(dòng)

String url=\"jdbc：oracle：thin：@localhost：1521：XE\"；

//數(shù)據(jù)庫連接URL

String user=\"oajsp\"； //數(shù)據(jù)庫用戶名

String password=\"111111\"； //數(shù)據(jù)庫密碼

JDBCCategoryDataset dataset=1；

try { //通過JDBC創(chuàng)建數(shù)據(jù)集合

dataset=new JDBCCategoryDataset（url，driverName，

user，password）；

String query=\"select 職稱，人數(shù) from 職稱統(tǒng)計(jì)報(bào)表\"；

//SQL語句

dataset.executeQuery（query）； //查詢并向數(shù)據(jù)集合中添加數(shù)據(jù)

} catch （Exception e） {

e.printStackTrace（）； }

return dataset； }

public static JFreeChart createChart（） { //創(chuàng)建柱狀圖

JFreeChart chart=ChartFactory.createBarChart（\"職稱人數(shù)統(tǒng)

計(jì)\"，\"職稱類別\"，\"人數(shù)\"，initCategoryData（），PlotOrientation

.VERTICAL，1，1，1）；

CategoryPlot plot=chart.getCategoryPlot（）； //獲取圖表區(qū)對(duì)象

plot.setBackgroundPaint（Color.white）； //設(shè)置網(wǎng)格背景顏色

plot.setRangeGridlinePaint（Color.pink）； //設(shè)置網(wǎng)格橫線顏色

BarRenderer renderer=new BarRenderer（）；

renderer.setBaseItemLabelGenerator（new StandardCategoryItemLabelGenerator（））；

renderer.setBaseItemLabelsVisible（true）；

plot.setRenderer（renderer）； //顯示每個(gè)柱的數(shù)值

return chart； } }

⑵ 在JSP中獲取生成的圖片。在OAJSP1工程Webroot目錄中新建一JSP文件（設(shè)文件名為bar.jsp），其代碼如下：

<%@ page language=\"java\" import=\"java.util.*\"

pageEncoding=\"GB2312\"%>

<%@ page import=\"org.jfree.chart.servlet.ServletUtilities，

db.BarChartUtil\"%>

<% String path=request.getContextPath（）；

String basePath=request.getScheme（）+\"：//\"+request

.getServerName（）+\"：\"+request.getServerPort（）+path+\"/\"； %>

<！DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0

1 Transitional//EN\">

\">

<% String fileName=ServletUtilities.saveChartAsJPEG

（BarChartUtil.createChart（），500，300，1，session）；

String graphURL=request.getContextPath（）+

\"/DisplayChart？filename=\"+fileName； %>

border=\"1\">

⑶ 啟動(dòng)tomcat服務(wù)器，在瀏覽器中輸入http：//localhost：8080/OAJSP1/bar.jsp，瀏覽相應(yīng)的JSP文件，運(yùn)行結(jié)果如圖2所示。

4 結(jié)束語

圖表的應(yīng)用不但可以使得數(shù)據(jù)的顯示更加清晰、直觀，而且能大大增強(qiáng)Web頁面的功能和顯示效果。JFreeChart能夠制作的圖表有很多種，但JFreeChart只提供了幾種常用的數(shù)據(jù)集合對(duì)象，對(duì)于沒有提供數(shù)據(jù)集合對(duì)象的圖表，制作時(shí)需要自己進(jìn)行底層數(shù)據(jù)庫操作的封裝，其實(shí)現(xiàn)過程相對(duì)復(fù)雜一些。本文介紹的利用JFreeChart中的數(shù)據(jù)集合對(duì)象來獲取數(shù)據(jù)庫中的數(shù)據(jù)在JSP中生成圖表的方法，其實(shí)現(xiàn)簡(jiǎn)單方便，具有通用性，應(yīng)用廣泛。

參考文獻(xiàn)：

[1] 朱賀新，穆榮，盧建軍.JFreeChart的應(yīng)用開發(fā)與改進(jìn)[J].西安科技大學(xué)學(xué)報(bào)，2008.12（28）：789-791

[2] 王征強(qiáng).利用JFreeChart開發(fā)包繪制圖表[J].刑臺(tái)職業(yè)技術(shù)學(xué)院學(xué)報(bào)，2007.2（24）：38-41

[3] 李村合，張培穎.基于J2EE的Java繪圖方法研究與實(shí)現(xiàn)[J].微計(jì)算機(jī)應(yīng)用，2005.26（4）：49-451

[4] 劉艷霞.JFreeChart在JSP開發(fā)中的應(yīng)用心得[J].工程地質(zhì)計(jì)算機(jī)應(yīng)用，2005.1：14-16

[5] 李伯宇，趙麗麗.在JSP中實(shí)現(xiàn)動(dòng)態(tài)圖表方法研究[J].計(jì)算機(jī)應(yīng)用，2003.23（6）：213-214

[6] 候俁，劉萬軍.JFreeChart在JavaWeb項(xiàng)目中的應(yīng)用[J].科學(xué)技術(shù)與工程，2008.5（8）：2699-2700

[7] 王國(guó)輝.Java Web開發(fā)實(shí)戰(zhàn)寶典[M].清華大學(xué)出版社，2010.