📄 用jfreechart创建基于web的图表 e800网站开发者频道.htm
字号:
href="http://database.e800.com.cn/">数据库</A> <A title=移动嵌入
href="http://embed.e800.com.cn/">移动嵌入</A> </LI></UL>
<UL class=RowB>
<LI class=NavShop><B>产品：</B> <A title=企业软件
href="http://software.e800.com.cn/">企业软件</A> <A title=Linux
href="http://linux.e800.com.cn/">Linux</A> <A title=服务器
href="http://server.e800.com.cn/">服务器</A> <A title=网络设备
href="http://network.e800.com.cn/">网络设备</A> <A title=专业存储
href="http://storage.e800.com.cn/">存储</A> <A title=信息安全
href="http://security.e800.com.cn/">安全</A> <A title=商业系统
href="http://business.e800.com.cn/">商业系统</A> <A title=无线网络
href="http://network.e800.com.cn/wirelist.html">无线网络</A> <A
title=绿色IT href="http://gv.e800.com.cn/">绿色IT</A> <A title=Cognos
href="http://cognos.e800.com.cn/">Cognos</A> </LI></UL></DIV>
<DIV class=MenuOther>
<UL>
<LI> <A
href="http://passport.e800.com.cn/mycomment.html">评论</A> <A
href="http://passport.e800.com.cn/mycollection.html">收藏</A> </LI>
<LI> <A
href="http://passport.e800.com.cn/myscores.html">积分</A> </A><A
href="http://passport.e800.com.cn/mysub.html">订阅</A> </LI></UL></DIV>
<DIV class=RowCL>
<DIV class=la><B>专题：</B> <A title=2009年IT发展十大战略技术
href="http://special.e800.com.cn/081214/index.html">十大战略技术</A> <A
title=2008服务器市场回顾
href="http://special.e800.com.cn/081211/index.html">服务器回顾</A> <A
title=“山寨”从产品走向文化
href="http://special.e800.com.cn/081210/index.html">山寨文化</A> <A
title=传统硬盘将易位？固态硬盘或是昙花一现？
href="http://special.e800.com.cn/081206/index.html">固态硬盘</A> <A
title=SNS网络：新社交时代
href="http://special.e800.com.cn/081205/index.html">新社交时代</A> <A
title="3G 离中国还有多远"
href="http://special.e800.com.cn/081204/index.html">3G中国</A> <A
title=SaaS时代的到来
href="http://special.e800.com.cn/081127/index.html">SaaS时代</A> <A
title="e800 移动嵌入"
href="http://embed.e800.com.cn/ccshao/ccshao.html">移动嵌入串串烧</A> </DIV>
<DIV class=lb><A title="e800 更多精彩专题"
href="http://special.e800.com.cn/list/1_1.html">更多精彩专题</A></DIV></DIV></DIV></DIV>
<SCRIPT>
var isLogin = 0;
var notLogin = 0;
var loginTimer = 0;
function checkLogin()
{
if(loginTimer) clearTimeout(loginTimer);
loginTimer = setTimeout("checkLogin()", 1000);
if ((cookie.get("e800login") == null) ||
(cookie.get("e800login") == "")||
((cookie.get("e800login")).length != 32)) {
if(!notLogin) {
//_gObj("login").innerHTML = _gObj("NotLogin").innerHTML;
notLogin = 1;
isLogin = 0;
}
return false;
} else if(!isLogin) {
isLogin = 1;
_gObj("login").innerHTML = cookie.get("cookie_mem")+' 你好！ <a href="#" target="_self" onclick="javascript:doLogout();">退出</a>';
}
return true;
}
checkLogin();
function doLogout() {
cookie.set("e800login", null, 0, "/", "e800.com.cn");
_gObj("login").innerHTML = _gObj("NotLogin").innerHTML;
notLogin = 1;
isLogin = 0;
return false;
}
function CheckValid(obj)
{
if (obj.memcode.value == "")
{
alert ("请填写用户名！");
obj.memcode.focus();
obj.memcode.value = "";
return false;
}
if (obj.mempwd.value == "")
{
alert ("请填写密码！");
obj.mempwd.focus();
obj.mempwd.value = "";
return false;
}
return true;
}
</SCRIPT>
<!-- 开发者文章页通栏1 -->
<DIV class=ad750><!--Adforward Begin:--><IFRAME marginWidth=0 marginHeight=0
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/adshow.htm" frameBorder=0 width=900
scrolling=no height=120></IFRAME><!--Adforward End--></DIV><!-- 导航 -->
<DIV id=DeveloperNavList>
<UL class=ATitle>
<LI>
<H3>开发者</H3></LI></UL>
<UL class=AList>
<LI><A title=开发者首页 href="http://developer.e800.com.cn/"
target=_self>首页</A> <A title=开发新闻
href="http://developer.e800.com.cn/list/42_1_1_1.html"
target=_self>新闻动态</A> <A title=java开发
href="http://developer.e800.com.cn/list/43_1_1_1.html"
target=_self>java开发</A> <A title=.net开发
href="http://developer.e800.com.cn/list/44_1_1_1.html"
target=_self><SPAN>.net开发</SPAN></A> <A title=Web开发
href="http://developer.e800.com.cn/list/45_1_1_1.html"
target=_self>Web开发</A> <A title=开发管理
href="http://developer.e800.com.cn/list/46_1_1_1.html"
target=_self>开发管理</A> <A title=移动/嵌入开发
href="http://developer.e800.com.cn/list/47_1_1_1.html"
target=_self>移动/嵌入开发</A> <A title=数据结构&算法分析
href="http://developer.e800.com.cn/list/48_1_1_1.html"
target=_self>数据结构&算法分析</A> <A title=开源关注
href="http://developer.e800.com.cn/list/49_1_1_1.html"
target=_self>开源关注</A> <A title=数据库开发
href="http://developer.e800.com.cn/list/143_1_1_1.html"
target=_self>数据库开发</A> <A title=C/C++开发
href="http://developer.e800.com.cn/list/144_1_1_1.html"
target=_self>C/C++开发</A> </LI></UL></DIV><!-- 您的位置搜索 -->
<SCRIPT type=text/javascript>
String.prototype.trim = function() { return this.replace(/^\s+|\s+$/g,''); }
function SearchCheck()
{
if (document.searchForm.keyword.value.trim() == "") {
alert("搜索关键字不能为空！");
document.searchForm.keyword.focus();
return false;
}
}
</SCRIPT>
<DIV id=DeveloperPlace>
<FORM name=searchForm onsubmit="javascript:return SearchCheck();"
action=http://search.e800.com.cn/search method=get>
<UL class=Place>
<LI><IMG alt=当前位置
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/developerplace1.gif"><A
title=e800网站 href="http://www.e800.com.cn/">e800网站</A><IMG
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/developerplace2.gif"><A
title=开发者频道 href="http://developer.e800.com.cn/">开发者频道</A> </LI></UL>
<UL class=Sear>
<LI>文章搜索:<INPUT size=30 name=keyword> <SELECT id=loginSelect
name=searchDomain> <OPTION value=0>选择频道</OPTION> <OPTION
value=27>cognos</OPTION> <OPTION value=26>绿色虚拟化</OPTION> <OPTION
value=25>专题文章</OPTION> <OPTION value=24>无线网络</OPTION> <OPTION
value=23>商业系统</OPTION> <OPTION value=22>数据库</OPTION> <OPTION
value=21>.net</OPTION> <OPTION value=20>Java</OPTION> <OPTION
value=19>移动与嵌入</OPTION> <OPTION value=17>解决方案</OPTION> <OPTION
value=16>通信网络</OPTION> <OPTION value=15>专业存储</OPTION> <OPTION
value=14>网络设备</OPTION> <OPTION value=13>服务器</OPTION> <OPTION
value=12>Linux</OPTION> <OPTION value=11 selected>开发者</OPTION> <OPTION
value=10>信息安全</OPTION> <OPTION value=9>企业软件</OPTION> <OPTION
value=8>CIO/CTO</OPTION> <OPTION value=7>IT时讯</OPTION></SELECT> <INPUT
type=image src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/developerplace3.gif">
<A href="http://developer.e800.com.cn/rss/2/11.xml"><IMG
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/rss.gif" align=absMiddle>
</A></LI></UL></FORM></DIV><!-- 文章页 -->
<DIV class=ContentA>
<DIV class=left><!-- Article Content body -->
<DIV class=AreaBor><!-- Article title -->
<DIV class=ArcTitle>
<H1>用JFreeChart创建基于Web的图表</H1>
<DIV class=ArcDate>2007-01-02
推荐:148 收藏:95 评论:0
来源:matrix</DIV></DIV><!--list title-->
<DIV class=LHotLableArticle id=LHotLable>
<UL>
<LI class=navta><IMG alt=热门标签
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/rss3.gif" align=absMiddle> </LI>
<LI class=navbg><IMG src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/rss3a.gif"
align=absMiddle> <A title=Web
href="http://search.e800.com.cn/search?keyword=Web&searchDomain=0">Web</A> <IMG
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/rss3b.gif" align=absMiddle> </LI>
<LI class=navbg><IMG src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/rss3a.gif"
align=absMiddle> <A title=表
href="http://search.e800.com.cn/search?keyword=%B1%ED&searchDomain=0">表</A> <IMG
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/rss3b.gif" align=absMiddle> </LI>
<LI class=navbg><IMG src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/rss3a.gif"
align=absMiddle> <A title=图表
href="http://search.e800.com.cn/search?keyword=%CD%BC%B1%ED&searchDomain=0">图表</A> <IMG
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/rss3b.gif" align=absMiddle> </LI>
<LI class=navbg><IMG src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/rss3a.gif"
align=absMiddle> <A title=JFreeChart
href="http://search.e800.com.cn/search?keyword=JFreeChart&searchDomain=0">JFreeChart</A> <IMG
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/rss3b.gif" align=absMiddle>
</LI></UL></DIV><!--Article Content -->
<DIV class=AreaCon>
<TABLE>
<TBODY>
<TR>
<TD> WWW的发展使得基于因特网的应用程序不再局限于静态或者简单的动态内容提供。传统的一些以软件包形式发布应用程序例如报表系统等都在逐渐搬到因特网上。但是这两者之间有着天壤之别，虽然对于数据获取、业务处理等方面基本类似，但是最大的差别在于用户界面。为了能在web浏览器上显示要求用户界面使用HTML以及图片的方式来展现数据，而传统的一些利用操作系统本身的控件来开发的用户界面无法适应琳琅满目的客户端，因此在这里也变得无能为力。<BR><BR> 回到本文的题目上来，为了创建一个可以在web浏览器上查看到图表一般有两种做法：第一种就是使用applet利用java本身对图形的支持来显示一个图表；第二种就是直接在web服务器端生成好图表图片文件后发送给浏览器。第一种方式显然对于客户端要求太高，随着现在主流浏览器放弃对JAVA的支持后，这种方式只适合一些局域网的应用，而对于因特网的环境就显得不太适合。因此我们下面将介绍一个JAVA的图表引擎JFreeChart用来产生基于WEB的图表。<BR><BR> <STRONG>一、JFreeChart项目简介</STRONG><BR><BR> JFreeChart是开放源代码站点SourceForge.net上的一个JAVA项目，它主要用来各种各样的图表，这些图表包括：饼图、柱状图(普通柱状图以及堆栈柱状图)、线图、区域图、分布图、混合图、甘特图以及一些仪表盘等等。这些不同式样的图表基本上可以满足目前的要求。为了减少篇幅本文主要介绍前面三种类型的图表，读者可以触类旁通去开发其他样式的图表。下面几个是JFreeChart产生的这三种类型图表的结果：
<BR><BR><IMG
onerror="this.src=''http://www.yesky.comhttp://images.e800.com.cn/articles/2007/1/2/1167667649386136353.gif'';"
hspace=3
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/1167667649386136353.gif"
align=center vspace=1 border=1><BR>图1<BR><BR><IMG
onerror="this.src=''http://www.yesky.comhttp://images.e800.com.cn/articles/2007/1/2/1167667649823136354.gif'';"
hspace=3
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/1167667649823136354.gif"
align=center vspace=1 border=1><BR>图2<BR><BR><IMG
onerror="this.src=''http://www.yesky.comhttp://images.e800.com.cn/articles/2007/1/2/1167667650183136355.gif'';"
hspace=3
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/1167667650183136355.gif"
align=center vspace=1
border=1><BR>图3<BR><BR> 上面的三个图都是表示四个季度的某个产品的销量信息。在继续下面小节之前必须先准备好开发环境，因为是基于WEB浏览器的图表展现，因此需要一个Servlet引擎或者是J2EE应用服务器（例如WebSphere，Tomcat等）。WEB环境的搭建就不累赘了，读者根据喜好自行安装。JFreeChart引擎本身需要到SourceForge.net上下载，地址如下：
<BR><BR> JFreeChart主页：http://www.jfree.org/jfreechart/index.html<BR><BR> JFreeChart下载页面：http://sourceforge.net/projects/jfreechart/<BR><BR> 下载的时候需要注意的是必须下载两个文件：JFreeChart以及Jcommon。目前最新配套版本是：JFreeChart
0.9.11 Jcommon 0.8.6
<BR><BR> 这里有点笔者在开发中遇见的问题需要注意的是：在使用Eclipse开发的时候会报一个莫名其妙的错误，错误可能指向某个类文件的第一行。遇到这样的问题一般是因为没有把Jcommon的jar包设置到项目的类路径中的缘故。具体的原因不祥。
（还有log4j等也咬一起导入）。<BR><BR>
<SCRIPT>zmbbs=1;</SCRIPT>
<DIV></DIV> <STRONG>二、解读JFreeChart的源码结构</STRONG><BR><BR> 在开始使用JFreeChart之前我们有必要先大概了解一下JFreeChart本身的结构以及它所带一些例子程序，这样有助于我们下一步自行开发。下载JFreeChart包后已经带有非常丰富的例子，因为JFreeChart这个项目本身的使用文档非常少，因此学习它最好的办法就是学习它所带的例子源码。在包org.jfree.chart.demo中有几十个文件用于展示JFreeChart所能支持的所有图表的结果。如果你的JDK是比较新的情况下可能在运行这些例子时会有问题，现象如下：
<BR><BR>
<TABLE width="100%" bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD>java.lang.UnsatisfiedLinkError: initDDraw<BR>at
sun.awt.windows.Win32OffScreenSurfaceData.initDDraw(Native
Method)<BR>at
sun.awt.windows.Win32OffScreenSurfaceData.＜clinit＞(Win32OffScreenSurfaceData.java:141)<BR>at
sun.awt.Win32GraphicsDevice.＜clinit＞(Win32GraphicsDevice.java:58)<BR>at
sun.awt.Win32GraphicsEnvironment.makeScreenDevice(Win32GraphicsEnvironment.java:168)<BR>at
sun.java2d.SunGraphicsEnvironment.getScreenDevices(SunGraphicsEnvironment.java:240)<BR>at
sun.awt.Win32GraphicsEnvironment.getDefaultScreenDevice(Win32GraphicsEnvironment.java:61)<BR>at
java.awt.Window.init(Window.java:224)<BR>at
java.awt.Window.＜init＞(Window.java:268)<BR>at
java.awt.Frame.＜init＞(Frame.java:398)<BR>at
javax.swing.JFrame.＜init＞(JFrame.java:198)<BR>at
org.jfree.chart.demo.JFreeChartDemo.＜init＞(JFreeChartDemo.java:148)<BR>at
org.jfree.chart.demo.JFreeChartDemo.main(JFreeChartDemo.java:285)<BR>Exception
in thread "main"
</TD></TR></TBODY></TABLE><BR> 这个错误是由于新版的Swing大量的使用了微软的DirectDraw的技术来提高画图的性能，而可能你的显卡在这时候会跟你闹点情绪或者显卡本身并不支持这样的一个技术。难道就没有办法了嘛？要解决这个问题也非常简单，我们可以屏蔽掉DirectDraw，不让Swing使用该技术就可以了。在运行这些代码时给虚拟机指定参数-Dsun.java2d.noddraw即可。
<BR><BR> 这时可能你又该纳闷了，不说是基于Web的图表嘛，怎么又扯到Swing上了？这是因为为了使开发者容易上手，无需配置任何运行环境，所以这些例子都是基于GUI方式的用于展现给开发者如果生成一个图表，我们要学习的也就是如何利用这个引擎生成图表而不是怎么来显示一个图表。当我们把生成的图表对象Export到一个图像文件即可在Web上发布。
<BR><BR> 下面我们来介绍JFreeChart中几个核心的对象类：<BR><BR>
<TABLE width="90%" bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD>＜table
boder=0＞<BR>＜tr＞＜td＞类名＜/td＞＜td＞类的作用以及简单描述＜/td＞＜/tr＞<BR>＜tr＞＜td＞JFreeChart＜/td＞＜td＞图表对象，任何类型的图表的最终表现形式都是在该对象进行一些属性的定制。JFreeChart引擎本身提供了一个工厂类用于创建不同类型的图表对象＜/td＞＜/tr＞<BR>＜tr＞＜td＞XXXXXDataset＜/td＞＜td＞数据集对象，用于提供显示图表所用的数据。根据不同类型的图表对应着很多类型的数据集对象类＜/td＞＜/tr＞<BR>＜tr＞＜td＞XXXXXPlot＜/td＞＜td＞
图表区域对象，基本上这个对象决定着什么样式的图表，创建该对象的时候需要Axis、Renderer以及数据集对象的支持＜/td＞＜/tr＞<BR>＜tr＞＜td＞XXXXXAxis＜/td＞＜td＞
用于处理图表的两个轴：纵轴和横轴＜/td＞＜/tr＞<BR>＜tr＞＜td＞XXXXXRenderer＜/td＞＜td＞负责如何显示一个图表对象＜/td＞＜/tr＞<BR>＜tr＞＜td＞XXXXXURLGenerator＜/td＞＜td＞
用于生成Web图表中每个项目的鼠标点击链接＜/td＞＜/tr＞<BR>＜tr＞＜td＞XXXXXToolTipGenerator＜/td＞＜td＞
用于生成图象的帮助提示，不同类型图表对应不同类型的工具提示类＜/td＞＜/tr＞<BR>＜/table＞
</TD></TR></TBODY></TABLE><BR> 基本上我认为JFreeChart项目本身的类结构的设计并不是很好，首先在创建图表的时候用到了大量的工厂方法，这样做虽然可以简化创建图表对象的代码，但是对项目本身或者开发人员来讲自行扩展一种新的图表都仍然是一件很麻烦的事情；其次除图表对象本身外其余的类过于复杂，使用者必须去了解每个类型的图表对象应该对应哪些Axis、Plot、Renderer类，并且必须非常熟悉这些类的构造函数中每个参数的具体含义。这些问题都大大困扰很多初学者。不过，虽然存在很多问题，但是JFreeChart本身仍不失为一个非常优秀的图表引擎，况且项目本身也在逐渐的发展中。
<BR> 在非常简略的介绍了JFreeChart本身的代码结构后，下面我们开始动手试验几个常用的图表并把他们放到web上。<BR><BR>
<SCRIPT>zmbbs=1;</SCRIPT>
<DIV></DIV> <STRONG>三、使用JFreeChart生成各种样式的图表</STRONG><BR><BR> 限于篇幅的问题我们在这里只实现两种常用的图表，其他类型图表读者可以触类旁通。我们先给出柱状图的实现，饼图的实现再来跟柱状图进行比较。
<BR><BR> 1 柱状图<BR><BR>
<TABLE width="90%" bgColor=#ffffff border=0>
<TBODY>
<TR>
<TD>[code]package lius.chart.demo;<BR><BR>import
java.io.*;<BR><BR>import org.jfree.data.*;<BR>import
org.jfree.chart.*;<BR>import org.jfree.chart.plot.*;<BR>/**<BR>*
该类用于演示最简单的柱状图生成<BR>* @author Winter Lau<BR>*/<BR>public class
BarChartDemo {<BR><BR> public static void main(String[] args) throws
IOException{<BR> CategoryDataset dataset =
getDataSet2();<BR> JFreeChart chart =
ChartFactory.createBarChart3D(<BR> "水果产量图", // 图表标题<BR> "水果", //
目录轴的显示标签<BR> "产量", // 数值轴的显示标签<BR> dataset, //
数据集<BR> PlotOrientation.VERTICAL, // 图表方向：水平、垂直<BR> true, //
是否显示图例(对于简单的柱状图必须是false)<BR> false, // 是否生成工具<BR> false //
是否生成URL链接<BR> );<BR><BR> FileOutputStream fos_jpg = null;<BR> try
{<BR> fos_jpg = new
FileOutputStream("D:\\fruit.jpg");<BR> ChartUtilities.writeChartAsJPEG(fos_jpg,100,chart,400,300,null);<BR> }
finally {<BR> try {<BR> fos_jpg.close();<BR> } catch
(Exception e) {}<BR> }<BR> }<BR><BR>/**<BR>* 获取一个演示用的简单数据集对象<BR>*
@return<BR>*/<BR><BR> private static CategoryDataset getDataSet()
{<BR> DefaultCategoryDataset dataset = new
DefaultCategoryDataset();<BR> dataset.addvalue(100, null,
"苹果");<BR> dataset.addvalue(200, null,
"梨子");<BR> dataset.addvalue(300, null,
"葡萄");<BR> dataset.addvalue(400, null,
"香蕉");<BR> dataset.addvalue(500, null, "荔枝");<BR> return
dataset;<BR> }<BR><BR>/**<BR>* 获取一个演示用的组合数据集对象<BR>*
@return<BR>*/<BR><BR> private static CategoryDataset getDataSet2()
{<BR> DefaultCategoryDataset dataset = new
DefaultCategoryDataset();<BR> dataset.addvalue(100, "北京",
"苹果");<BR> dataset.addvalue(100, "上海",
"苹果");<BR> dataset.addvalue(100, "广州",
"苹果");<BR> dataset.addvalue(200, "北京",
"梨子");<BR> dataset.addvalue(200, "上海",
"梨子");<BR> dataset.addvalue(200, "广州",
"梨子");<BR> dataset.addvalue(300, "北京",
"葡萄");<BR> dataset.addvalue(300, "上海",
"葡萄");<BR> dataset.addvalue(300, "广州",
"葡萄");<BR> dataset.addvalue(400, "北京",
"香蕉");<BR> dataset.addvalue(400, "上海",
"香蕉");<BR> dataset.addvalue(400, "广州",
"香蕉");<BR> dataset.addvalue(500, "北京",
"荔枝");<BR> dataset.addvalue(500, "上海",
"荔枝");<BR> dataset.addvalue(500, "广州", "荔枝");<BR> return
dataset;<BR> }<BR>}<BR>[/code]</TD></TR></TBODY></TABLE><BR> 程序运行结束后生成的图片文件效果如下图所示：<BR><BR><IMG
onerror="this.src=''http://www.yesky.comhttp://images.e800.com.cn/articles/2007/1/2/1167667650898136356.gif'';"
hspace=3
src="用JFreeChart创建基于Web的图表 e800网站开发者频道.files/1167667650898136356.gif"
align=center vspace=1
border=1><BR>图4<BR><BR> 如果是使用简单的数据即使用getDataSet方法获取数据集时产生的图片文件如下：
<BR><BR><IMG
onerror="this.src=''http://www.yesky.comhttp://images.⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -