- 浏览: 167292 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (186)
- [网站分类]4.其他技术区 (93)
- [网站分类]6.转载区(Java技术文章转载, 请注明原文出处) (4)
- [网站分类]3.非技术区 (7)
- [网站分类]1.网站首页原创Java技术区(对首页文章的要求: 原创、高质量、经过认真思考并精心写作。BlogJava管理团队会对首页的文章进行管理。) (28)
- HTML&CSS (0)
- 感悟生活 (4)
- c#(.net) (1)
- [网站分类]2.Java新手区 (32)
- [网站分类]5.提问区(Java方面的技术提问) (1)
- java (6)
- web前端 (7)
- php (0)
- C++ (1)
- python (0)
- 互联网应用 (0)
最新评论
-
lliiqiang:
请求单线程资源只能等待结果.
Applet 与JS通信 -
feng2qin:
期待你的精彩回到。QQ:864479410
Applet 与JS通信 -
feng2qin:
我想问一句;哥们儿,applet程序中调用js,你真的成功了嘛 ...
Applet 与JS通信 -
lyaixsp:
...
ExtJS 入门学习之 window与panel篇 -
longzijian:
不知道 java-he 现在找到数组的这种特性 的原因在那里
和网友关于javascript数组的讨论
报表使用经验、技巧大总结(包括JFreechart、JS chart以及自己的使用经验)
报表使用经验、技巧大总结<?xml:namespace prefix = o /?>
前面我的工作中用到了报表,当时积累了一些试用心得。也触发了一些灵感。这里总结下来,希望对大家有一定帮助。
一、 利用基本的TABLE元素
——自己的创意之作
可以参考我先前的一篇关于TABLE制作柱状图的blog:
http://www.blogjava.net/JAVA-HE/archive/2007/04/20/112352.html
如果只是需要在页面上现实一些柱状图,那么这种方式是非常简单和实用的。核心原理利用HTML的基本元素——table。绘制table,不显示其边框,不显示其间距,然后利用获得的数据,使用JS控制哪行哪列用什么颜色。
如:
document.getElementById('tab').rows[0].cells[0].bgColor = 'red';
二、立体感的柱状图
——这是在网上陶下来的漂亮代码
2
3<!--[if !mso]>
4
5<style>
6
7v\:* { behavior: url(#default#VML) }
8
9o\:* { behavior: url(#default#VML) }
10
11.shape { behavior: url(#default#VML) }
12
13</style>
14
15<![endif]-->
16
17<HEAD>
18
19<TITLE>柱状图形报表样列</TITLE>
20
21<SCRIPT LANGUAGE="JavaScript">
22
23//addPole 增加一个柱状图
24
25//left 与窗口左边的距离
26
27//width 宽度
28
29//height 高度
30
31//zindex 层高度
32
33//fillcolor 主色
34
35//color 渐变色
36
37//type 默认为竖,1为横
38
39function addPole(left,top,width,height,zindex,fillcolor,color,type){
40
41 top=top-height;
42
43 var a="";
44
45 if(type==1){
46
47 a="angle='-90' focus='100%'";
48
49 }
50
51 var html="<v:rect style='position:absolute;";
52
53 html=html+"left:"+left+"px;";
54
55 html=html+"top:"+top+"px;";
56
57 html=html+"width:"+width+"px;";
58
59 html=html+"height:"+height+"px;";
60
61 html=html+"z-index:"+zindex+"'";
62
63 html=html+"fillcolor='"+fillcolor+"'>";
64
65 html=html+"<v:fill color2='"+color+"'";
66
67 html=html+" rotate='t' "+a+" type='gradient'/><o:extrusion v:ext='view' backdepth='20pt' ";
68
69 html=html+"color='"+fillcolor+"' on='t'/></v:rect>";
70
71 document.write(html);
72
73}
74
75
76
77//left 与窗口左边的距离
78
79//width 宽度
80
81//height 高度
82
83//zindex 立体高度
84
85//fillcolor 主色
86
87function addBackground(left,top,width,height,zindex,fillcolor){
88
89 top=top-height;
90
91 var html="<v:rect style='position:absolute;left:"+left+"px;";
92
93 html=html+"top:"+top+"px;";
94
95 html=html+"width:"+width+"px;";
96
97 html=html+"height:"+height+"px;";
98
99 html=html+"z-index:"+zindex+"'";
100
101 html=html+"fillcolor='"+fillcolor+"'";
102
103 html=html+" stroked='f'><v:fill rotate='t' angle='-45' focus='100%' type='gradient'/></v:rect>";
104
105 document.write(html);
106
107}
108
109
110
111function addLine(zindex,from,to,color){
112
113 var html="<v:line style='position:absolute;left:0;text-align:left;top:0;flip:y;z-index:"+zindex+"'";
114
115 html=html+" from='"+from+"' to='"+to+"' strokecolor='"+color+"'/>"
116
117 document.write(html);
118
119}
120
121
122
123function addText(left,top,width,height,zindex,value,fontsize){
124
125 top=top-height;
126
127 var html="<v:shape style='position:absolute;left:"+left+"px;";
128
129 html=html+"top:"+top+"px;";
130
131 html=html+"width:"+width+"px;";
132
133 html=html+"height:"+height+"px;";
134
135 html=html+"z-index:"+zindex+"'>";
136
137 html=html+"<v:textbox inset='0px,0px,0px,0px'><table cellspacing='3' cellpadding='0' width='100%' height='100%'><tr><td";
138
139 html=html+" style='FONT-SIZE:"+fontsize+"' align='center'>"+value+"</td></tr></table></v:textbox></v:shape>";
140
141 document.write(html);
142
143}
144
145
146
147function addGround(left,top,width,height,zindex,fillcolor,linecolor1,linecolor2,offset,level,min,leftoffset,textwidth,textheight,fontsize){
148
149 addBackground(left,top,width,height,zindex,fillcolor);
150
151 addLine(zindex,left+"px,"+top+"px",((left-0)+(width-0))+"px,"+top+"px",linecolor1);
152
153 addLine(zindex,left+"px,"+top+"px",left+"px,"+(top-height)+"px",linecolor1);
154
155 addLine(zindex,((left-0)+(offset-0))+"px,"+(top-offset)+"px",((left-0)+(width-0))+"px,"+(top-offset)+"px",linecolor2);
156
157 addLine(zindex,((left-0)+(offset-0))+"px,"+(top-offset)+"px",((left-0)+(offset-0))+"px,"+(top-height)+"px",linecolor2);
158
159 addLine(zindex,left+"px,"+(top-offset)+"px",((left-0)+(offset-0))+"px,"+top+"px",linecolor2);
160
161 for(var i=1;i<level;i++){
162
163 addLine(zindex,left+"px,"+(top-offset-(height*i)/level)+"px",((left-0)+(offset-0))+"px,"+(top-(height*i)/level)+"px",linecolor2);
164
165 addLine(zindex,(left-leftoffset)+"px,"+(top-(height*i)/level)+"px",left+"px,"+(top-(height*i)/level)+"px",linecolor1);
166
167 addText(left-textwidth,(top-(height*i)/level)+(textheight-0)+2,textwidth,textheight,"-1",i*min,fontsize)
168
169 addLine(zindex,((left-0)+(offset-0))+"px,"+(top-offset-(height*i)/level)+"px",((left-0)+(width-0))+"px,"+(top-offset-(height*i)/level)+"px",linecolor2);
170
171 }
172
173 addLine(zindex,(left-leftoffset)+"px,"+(top-(height*level)/level)+"px",left+"px,"+(top-(height*level)/level)+"px",linecolor1);
174
175 addText(left-textwidth,(top-(height*level)/level)+(textheight-0)+2,textwidth,textheight,"-1",level*min,fontsize)
176
177}
178
179
180
181function addEPole(left,top,width,height,zindex,fillcolor,color,textwidth,textheight,value1,value2,fontsize){
182
183 addText(left-textwidth/2+width/2,top-height-10,textwidth,textheight,zindex,value1,fontsize);
184
185 addText(left-textwidth/2+width/2,(top-0)+(textheight-0),textwidth,textheight,zindex,value2,fontsize);
186
187 addPole(left,top,width,height,zindex,fillcolor,color)
188
189}
190
191</SCRIPT>
192
193</HEAD>
194
195
196
197<BODY>
198
199<div>
200
201<SCRIPT LANGUAGE="JavaScript">
202
203<!--
204
205
206
207addEPole("180","400","30","150","1","#3300FF","#66FFFF","80","18","300","1月份","9pt");
208
209addEPole("230","400","30","300","1","#FF0000","#99FFFF","80","18","600","2月份","9pt");
210
211addEPole("280","400","30","200","1","#33CC00","#99FFFF","80","18","400","3月份","9pt");
212
213addEPole("330","400","30","100","1","#FF0099","#99FFFF","80","18","200","4月份","9pt");
214
215addEPole("380","400","30","50","1","#660000","#99FFFF","80","18","100","5月份","9pt");
216
217addEPole("430","400","30","20","1","#FFFF00","#99FFFF","80","18","40","6月份","9pt");
218
219addEPole("480","400","30","180","1","#330066","#99FFFF","80","18","360","7月份","9pt");
220
221addEPole("530","400","30","120","1","#CC6633","#99FFFF","80","18","240","8月份","9pt");
222
223addEPole("580","400","30","80","1","#9933FF","#99FFFF","80","18","160","9月份","9pt");
224
225addGround("160","400","460","300","-1","#33CCFF","#000000","#6699CC","10","6","100","20","40","18","9pt")
226
227//-->
228
229</SCRIPT>
230
231</div>
232
233</body>
234
235</html>
236
效果图如下:
<?xml:namespace prefix = v /?><shapetype id="_x0000_t75" coordsize="21600,21600" o:spt="75" o:preferrelative="t" path="m@4@5l@4@11@9@11@9@5xe" filled="f" stroked="f"><lock v:ext="edit" aspectratio="t"><br></lock></shapetype>
是不是很漂亮呢?我是觉得很漂亮。
其中方法调用,想知道每个参数的详细信息,你可以自己试:
addEPole("580","400","30","80","1","#9933FF","#99FFFF","80","18","160","9月份","<?xml:namespace prefix = st1 /?><chmetcnv tcsc="0" numbertype="1" negative="False" hasspace="False" sourcevalue="9" unitname="pt" w:st="on">9pt</chmetcnv>");
参数含义包括上边距离,左边距,以及高宽,以及XY上的内容 。以及颜色,柱体的宽度等等信息。
addGround("160","400","460","300","-1","#33CCFF","#000000","#6699CC","10","6","100","20","40","18","<chmetcnv tcsc="0" numbertype="1" negative="False" hasspace="False" sourcevalue="9" unitname="pt" w:st="on">9pt</chmetcnv>")
定义了范围大小以及6个刻度,每个100,还包括字体大小,刻度线颜色,以及内部线条颜色,以及渐变色等等含义。
三、JFreechart使用
注意生成图都自动存在临时文件夹里的。
总结过上手资料文章:
但是朋友反映总结得过于粗浅。
这里写详细点:
1. 柱状图
2
3 dataset.addValue (300, "广州", "苹果");
4
5 dataset.addValue (200, "广州", "梨子");
6
7 dataset.addValue (600, "广州", "葡萄");
8
9 dataset.addValue (340, "广州", "芒果");
10
11 dataset.addValue (280, "广州", "荔枝");
12
13 JFreeChart chart = ChartFactory.createBarChart3D ("水果销量统计图","水果","销量",
14
15 dataset,PlotOrientation.VERTICAL, //选择水平或者垂直放
16
17 false,//是否显示颜色类别(地区)提示
18
19 false,
20
21 false);
22
23 String filename = ServletUtilities.saveChartAsPNG (chart, 500, 300, null, session);
24
25 String graphURL = request.getContextPath () + "/servlet/DisplayChart?filename=" + filename;
26
27
2. 饼图
2
3 data.setValue("六月", 500);
4
5 data.setValue("七月", 580);
6
7 data.setValue("八月", 828);
8
9 PiePlot plot = new PiePlot(data);
10
11 JFreeChart chart = new JFreeChart("", JFreeChart.DEFAULT_TITLE_FONT, plot, true);
12
13 chart.setBackgroundPaint(java.awt.Color.white); //可选,设置图片背景色
14
15 chart.setTitle("Welcome to Jfreechart !"); //可选,设置图片标题
16
17 ChartRenderingInfo info = new ChartRenderingInfo(new StandardEntityCollection());
18
19 //500是图片长度,300是图片高度
20
21 String filename = ServletUtilities.saveChartAsPNG(chart, 500, 300, info, session);
22
23String graphURL = request.getContextPath() + "/servlet/DisplayChart?filename=" + filename;
24
25
26
27在插入图片的地方:
28
29<img src="<%= graphURL %>" width=500 height=300 border=0 usemap="#<%= filename %>">
30
31
32
33在xml中加入了:
34
35<servlet>
36
37 <servlet-name>DisplayChart</servlet-name>
38
39 <servlet-class>org.jfree.chart.servlet.DisplayChart</servlet-class>
40
41 </servlet>
42
43 <servlet-mapping>
44
45 <servlet-name>DisplayChart</servlet-name>
46
47 <url-pattern>/servlet/DisplayChart</url-pattern>
48
49 </servlet-mapping>
50
51图片效果,请访问:http://www.blogjava.net/JAVA-HE/archive/2007/04/18/111439.html
52
53还可以如下创建 dataset对象:
54
55double[][] data = new double[][] {{672, 766, 223, 540, 126}, {325, 521, 210, 340, 106}, {332, 256, 523, 240, 526} };
56
57 String[] rowKeys = {"苹果","梨子","葡萄"};
58
59 String[] columnKeys = {"北京","上海","广州","成都","深圳"};
60
61CategoryDataset dataset = DatasetUtilities.createCategoryDataset(rowKeys, columnKeys, data);
62
63
效果:
<shape id="_x0000_i1027" type="#_x0000_t75"><imagedata src="file:///C:%5CDOCUME~1%5Cjava-he%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image003.png" o:title=""></imagedata></shape>
参照网上介绍的一些文章总是发现不能向我的这么顺利,不是说他们的有错。我想版本不一样了 。区别肯定是有的。
实际上建立什么样的图表,ChartFactory可以选择不同方法建立不同图表的。
比如直接讲原来一个柱状图,中改了一个方法,图就变了。
如:
2
3 dataset,PlotOrientation.VERTICAL,//选择水平或者垂直放
4
5 true,//广州或者成都,这里颜色有区别的。(颜色类别)
6
7 true,
8
9 true);
10
11
对比两幅图。只是方法名字不同。
<shape id="_x0000_i1026" type="#_x0000_t75"><imagedata src="file:///C:%5CDOCUME~1%5Cjava-he%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image007.png" o:title=""><div align="center" src_cetemp="/images/blogjava_net/java-he/j4.PNG"> <img height="302" alt="" src="http://www.blogjava.net/images/blogjava_net/java-he/j4.PNG" width="511" border="0"> </div> </imagedata></shape>
再来个3D的:(createLineChart3D方法)
<shape id="_x0000_i1029" type="#_x0000_t75"><imagedata src="file:///C:%5CDOCUME~1%5Cjava-he%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image009.png" o:title=""></imagedata></shape>
而作为createAreaChart建立的面积比例图:
需要注意点的是,数据先后对图像效果是有影响的。因为有覆盖存在。
<shape id="_x0000_i1030" type="#_x0000_t75"><imagedata src="file:///C:%5CDOCUME~1%5Cjava-he%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image011.png" o:title=""></imagedata></shape>
补充一个让大家都晕的,我居然一直一位JFreechart 和CEWOLG是一个东西。所以总在那里找标签。还以为我下载的版本不同,所以那些东西都找不到呢!
四、结合cewolf使用
实际上大量应用的是线图:
经典应用,无非是读取数据库,然后根据数据库中的值来生成线图。
生成线图的JSP:
2
3<%@page pageEncoding="UTF-8"%>
4
5<%@page import="java.sql.*"%>
6
7<%@page import="java.util.*"%>
8
9<%@page import="de.laures.cewolf.*"%>
10
11<%@page import="de.laures.cewolf.tooltips.*"%>
12
13<%@page import="de.laures.cewolf.links.*"%>
14
15<%@page import="org.jfree.data.*"%>
16
17<%@page import="org.jfree.data.time.*"%>
18
19<%@page import="org.jfree.data.gantt.*"%>
20
21<%@page import="org.jfree.chart.*"%>
22
23<%@page import="org.jfree.chart.plot.*"%>
24
25<%@page import="org.jfree.data.category.*"%>
26
27<%@page import="org.jfree.data.general.*"%>
28
29<%@page import="org.jfree.data.xy.*"%>
30
31<%@page import="java.awt.*" %>
32
33<%@page import="de.laures.cewolf.taglib.CewolfChartFactory" %>
34
35<%@page import="org.jfree.chart.event.ChartProgressListener" %>
36
37<%@page import="org.jfree.chart.event.ChartProgressEvent" %>
38
39<%@page import="com.palmtech.util.*" %>
40
41<%@page import="com.palmtech.sqldata.*" %>
42
43<%
44
45final int round=roleInfo.round;//获取游戏轮数
46
47int[][] loanDataTemp=new int[round][2];
48
49conn = null;
50
51result = new Vector ();
52
53ps = null;
54
55try
56
57{
58
59 conn = DriverManager.getConnection ("proxool.BreadServer");
60
61 ps = conn.prepareStatement ("CALL proc_graph_role_fee(?,?,?)");
62
63 ps.setInt (1,gameID);
64
65 ps.setInt (2,roleID);
66
67 ps.setInt (3,2);
68
69 ResultSet rs = ps.executeQuery ();
70
71 for(int histroyRound=0;histroyRound<round;histroyRound++)
72
73 {
74
75 rs.absolute (histroyRound+1);//游标从1开始
76
77 for(int i=0;i<2;i++)
78
79 {
80
81
82
83 loanDataTemp[histroyRound][i]=rs.getInt (2+i);
84
85 //out.print (loanDataTemp[histroyRound][i]+" ");
86
87 }
88
89 //out.println ("<br>");
90
91 }
92
93 rs.close ();
94
95 ps.close ();
96
97 ps = null;
98
99}
100
101catch (Exception ex)
102
103{
104
105 ex.printStackTrace ();
106
107 result = new Vector ();
108
109}
110
111finally
112
113{
114
115 if(ps!=null)
116
117 {try
118
119 {ps.close ();}
120
121 catch(Exception e)
122
123 {}ps=null;}
124
125 try
126
127http://www.blogjava.net/Im
发表评论
-
详细总结LOG4J的使用
2007-02-06 16:31 6601 import java.util.*; 2 impor ... -
数字签名
2007-02-06 16:39 724使用applet经常涉及到java的砂箱问题,由于java的安 ... -
常见排序算法
2007-02-06 16:48 791<!--<br><br> ... -
测试连接数据源
2007-02-06 17:07 7701 ////////////////////////// ... -
解析XML
2007-02-06 17:12 6121 2 package com.parsexml ; ... -
BASE64编码
2007-02-06 17:16 7231 ////////////////////////// ... -
MD5加密
2007-02-07 09:49 888<!--<br><br>Cod ... -
省市地区三级菜单
2007-02-07 09:58 1186级联菜单:(1.js文件)<!--<br>& ... -
解析XML字符串与xml文件
2007-02-07 10:53 900对两种情况,这个文件不需要修改:<!--<br&g ... -
总结WebService的使用
2007-02-08 09:18 731一、安装jsp程序员应该不会装错。首先下载axis,解压缩。将 ... -
Applet 与JS通信
2007-02-08 16:09 4811Applet 与JS通信:一、页面嵌入applet:<a ... -
正则表达式使用详解
2007-02-14 10:54 734如果我们问那些UNIX系 ... -
xml学习总结之一
2007-02-15 13:16 7001 . XML 与 DTD —— XML 入门知识 1 ... -
xml学习总结之二
2007-02-26 10:49 6322. XML 名称空间 XML 命 ... -
JAVA 写的一截屏小工具
2007-03-01 09:48 675该截图工具的原代码参照了网上一文:(http://www.ch ... -
记事本程序
2007-03-08 12:09 659写了一个记事本程序,程序运行效果如下。 ... -
servlet学习笔记之一
2007-03-09 10:48 580servlet 学习笔记 自序 昨天心情有些失落。公司从去 ... -
servlet学习笔记之二
2007-03-26 19:16 538servlet 学习笔记之二 — ... -
servlet学习笔记之三
2007-03-26 19:25 555servlet 学习笔记之三 ——关于 web 应用程序的部 ... -
JFreeChart 入门指南
2007-04-18 01:47 759JFreeChart也许对大家来说很陌生,JFreeCh ...
相关推荐
JfreeChart学习总结JfreeChart学习总结
JFreeChart水晶报表制作 JFreeChart水晶报表制作
jfreechart报表 可以制作各种图形
JFreeChart是开放源代码站点SourceForge.net上的一个JAVA项目,它主要用来各种各样的图表,这些图表包括:饼图、柱状图(普通柱状图以及堆栈柱状图)、线图、区域图、分布图、混合图、甘特图以及一些仪表盘等等。...
jfreechart and open flash chart整理jfreechart and open flash chart整理
JFreeChart报表(java),有直方图,饼图,折线图。java报表项目
开发java报表的帮助文档,贡献给需要的各位。
JFreeChart报表小例子 public class SimpleJFreeChart { public static void main(String[] args){ DefaultPieDataset dpd=new DefaultPieDataset(); //建立一个默认的饼图 dpd.setValue("管理人员", 25); //...
就是最后生成JFreeChart chart报表对象,原来项目上是执行String filename = ServletUtilities.saveChartAsPNG(chart, 500, 300, null, session); String graphURL =request.getContextPath+"/servlet/DisplayChart?...
JFreeChart使用详细教程 图片报表
这是一款免费的JAVA生成报表的工具,里面有柱状图、饼状图、折线图的Demo简单易学
一个jfreechart报表的简单dome!
java中的报表(jfreeChart原创)
NULL 博文链接:https://yhlllq.iteye.com/blog/2034496
jfreechart生成报表会有乱码问题,这是解决报表乱码的,很好用
jfreechart(包jfreechart(包含jfreechart.jar和jcommon-1.0.13.jar) jfreechart(包含jfreechart.jar和jcommon-1.0.13.jar) jfreechart(包含jfreechart.jar和jcommon-1.0.13.jar) jfreechart(包含jfreechart.jar和...
深入探究JFreeChart(图表报表实用教材) 深入探究JFreeChart(图表报表实用教材) 深入探究JFreeChart(图表报表实用教材)
JFreeChart是一组功能强大、灵活易用的Java绘图API,使用它可以生成多种通用性的报表,包括柱状图、饼图、曲线图、甘特图等。它能够用在Swing和Web等中制作自定义的图表或报表,并且得到广泛的应用。本文将通过引领...