JavaWeb实现图形报表折线图的方法
本文实例讲述了JavaWeb实现图形报表折线图的方法。分享给大家供大家参考，具体如下：
步骤说明:
1. 导入log4j.jar,jfreechart-0.9.18.jar,jdom.jar,jcommon-0.9.3.jar四个jar包
2. 在某个包中写入Tuxin.Java类
package com.mengya.util;
import java.awt.Color;
import java.awt.Font;
import java.io.PrintWriter;
import javax.servlet.http.HttpSession;
import org.jfree.chart.ChartFactory;
import org.jfree.chart.ChartRenderingInfo;
import org.jfree.chart.ChartUtilities;
import org.jfree.chart.JFreeChart;
import org.jfree.chart.StandardLegend;
import org.jfree.chart.axis.NumberAxis;
import org.jfree.chart.entity.StandardEntityCollection;
import org.jfree.chart.plot.CategoryPlot;
import org.jfree.chart.plot.PlotOrientation;
import org.jfree.chart.renderer.LineAndShapeRenderer;
import org.jfree.chart.servlet.ServletUtilities;
import org.jfree.data.DefaultCategoryDataset;
public class Line
{
private DefaultCategoryDataset dataset = new DefaultCategoryDataset();
public void setValue(int sum, String line, String wfield)
{
dataset.addValue(sum, line, wfield);
}
public String generateLineChart(String title,String wfield, String hfield, HttpSession session, PrintWriter pw,int wPhoto,int hPhoto)
{
String filename = null;
try
{
final JFreeChart chart = ChartFactory.createLineChart
(
title, // 图表标题
wfield, // 横轴的显示标签
hfield, // 纵轴的显示标签
dataset, //数据集
PlotOrientation.VERTICAL, // 图表方向：水平、垂直
true, // 是否显示图例
true, // 是否生成提示工具 tooltips
false // 是否生成URL链接
);
StandardLegend legend = (StandardLegend) chart.getLegend();//生成图例
legend.setDisplaySeriesShapes(true);//显示图例形状
legend.setShapeScaleX(1.5);//设置图例X轴的大小
legend.setShapeScaleY(1.5);//设置图例Y轴的大小
legend.setDisplaySeriesLines(true);//显示图示项的横线
//设置图片的背景色
chart.setBackgroundPaint(new java.awt.Color(189,235,255));
CategoryPlot plot = (CategoryPlot) chart.getPlot();
plot.setBackgroundPaint(new Color(239,251,255));//生成图片中墙体的背景色
plot.setRangeGridlinePaint(Color.black);//生成图片中格子线的颜色
// 没有数据时显示的消息
plot.setNoDataMessage("没有相关统计数据");
plot.setNoDataMessageFont(new Font("黑体", Font.CENTER_BASELINE, 16));
plot.setNoDataMessagePaint(Color.RED);
NumberAxis rangeAxis = (NumberAxis) plot.getRangeAxis();
rangeAxis.setStandardTickUnits(NumberAxis.createIntegerTickUnits());//设置图中的刻度线的单位
rangeAxis.setAutoRangeIncludesZero(true);//强制在自动选择的数据范围中包含0
LineAndShapeRenderer renderer = (LineAndShapeRenderer) plot.getRenderer();
renderer.setDrawShapes(true);//折线的数据点根据分类使用不同的形状
renderer.setItemLabelsVisible(true);//显示每个点上的数据值的提示工具,数据标签是否可见
ChartRenderingInfo info = new ChartRenderingInfo(new
StandardEntityCollection());
//500是图片长度，300是图片高度
filename = ServletUtilities.saveChartAsPNG(chart, wPhoto, hPhoto, info, session);
ChartUtilities.writeImageMap(pw, filename, info);
pw.flush();
}
catch(Exception e)
{
e.printStackTrace();
}
return filename;
}
}
3. 配置web.xml,在web.xml中添加如下内空:
<servlet> <servlet-name>DisplayChart</servlet-name> <servlet-class> org.jfree.chart.servlet.DisplayChart </servlet-class> </servlet> <servlet-mapping> <servlet-name>DisplayChart</servlet-name> <url-pattern>/DisplayChart</url-pattern> </servlet-mapping>
4. 在要显示图片的jsp中添加内容:
<%@ page language="java" import="java.util.*,com.mengya.util.Line,com.mengya.bean.StuBean" pageEncoding="gbk"%>
<%@page import="java.io.PrintWriter;"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>折线图</title>
</head>
<body>
<%
Line tt = new Line();
//第一条折线
List ar = (ArrayList) request.getAttribute("arr1");
for (int i = 0; i < ar.size(); i++) {
StuBean bean = (StuBean) ar.get(i);
tt.setValue((int) bean.getS_money(), "张明学个人消费比例图", bean.getS_month()+ "");
}
//条二条折线
ar = (ArrayList) request.getAttribute("arr2");
for (int i = 0; i < ar.size(); i++) {
StuBean bean = (StuBean) ar.get(i);
tt.setValue((int) bean.getS_money(), "梦娅个人消费比例图", bean.getS_month()+ "");
}
//说明:tt.setValue(int a,String b,String c)
//其中的第二个参数b是该条折线的名字,每条折线的名字最好不要一样.
String filename = tt.generateLineChart("个人消费比例图", "月 份",
"费 用", session, new PrintWriter(out), 800, 550);
String graphURL = request.getContextPath()
+ "/DisplayChart?filename=" + filename;
%>
<P ALIGN="CENTER">
<img src="<%=graphURL %>" width=800 height=550 border=1 usemap="#<%=filename%>">
</body>
</html>
希望本文所述对大家JSP程序设计有所帮助。
相关推荐
-
web的各种前端打印方法之jquery打印插件PrintArea实现网页打印
第一步: jquery.PrintArea.js下载js引用 复制代码 代码如下: <script language="javascript" src="jquery-1.7.1.min.js"></script> <script type="text/javascript" src="jquery.PrintArea.js"></script> html引用: 复制代码 代码如
-
基于MVC+EasyUI的web开发框架之使用云打印控件C-Lodop打印页面或套打报关运单信息
在最新的MVC4+EasyUI的Web开发框架里面,我整合了关于网购运单处理的一个模块,其中整合了客户导单.运单合并.到货扫描.扣仓.出仓.查询等各个模块的操作,里面涉及到一些运单套打的操作,不过由于之前介绍LODOP不兼容Chrome等浏览器,因此曾经想放弃这个控件的打印处理,不过他们及时推出了"云打印控件C-Lodop",而且对之前的接口几乎完全兼容,因此在框架里也继续沿用了这个控件来进行相关的打印处理,包括常规的打印和运单信息套打等处理. 1.控件的安装 这个云控件C-Lodop
-
js控制web打印(局部打印)方法整理
首先定义css样式: 复制代码 代码如下: @media print { .noprint { display: none;color:green } } 对于不想打印的内容只用在标签中加上 class=noprint即可,打印的时候客户也不会看到页面任何变化. 打印时调用 window.print(); 另外几种js局部打印的方法: 移花接木: 打印的时候,把需要打印的内容替换成整个body内容(用户会在打印的时候看到变化,客户体验不太好) 复制代码 代码如下: function previe
-
网页WEB打印控件制作
在WEB系统中,打印的确是比较烦人的问题,如果我们能制作一个属于自己的自定义的打印插件,那么我们在后续自定义打印的时候能随心所欲的控制打印,这样的效果对于程序员来说是非常开心的一件事件,本文将自己开发编写的C# 制作的HTML打印插件分享出来,让有同样需求的朋友提供一个参考:此插件是基于Microsoft .NET Framework 2.0 开发的,缺点是每台客户端在安装插件时,必须要安装Microsoft .NET Framework 2.0 :本插件能实现 页眉.页脚.表头.标题.表尾的分
-
web的各种前端打印方法之jquery打印插件jqprint实现网页打印
web的打印方法具我自己懂得知道的有: 1.JQuery插件Jqprint实现 2.JQery打印插件PrintArea实现网页打印 3.CSS控制网页打印样式 JQuery插件Jqprint实现: 首先要导入js文件: jquery.jqprint.js下载 复制代码 代码如下: <script language="javascript" src="jquery-1.7.1.min.js"></script> <script lang
-
利用javascript实现web页面中指定区域打印
最近做到了web页面课程表打印时,上网找了一些资料,最后使用了下面的方法实现了我需要的功能.将需要打印的课程表的table放入div标签中,然后指定出需要打印的区域,最后调用window.print打印指定内容. 示例代码(代码中有些内容已省略) 复制代码 代码如下: function preview() { bdhtml = window.document.body.innerHTML; sprnstr = "<!--startprint-->"; ep
-
水晶报表asp.net的webform下基本用法实例
本文实例讲述了水晶报表asp.net的webform下基本用法.分享给大家供大家参考. 具体实现方法如下: 复制代码 代码如下: protected void Page_Init(object sender, EventArgs e) { ConfigureCrystalReport(); } protected void Page_Unload(object sender, EventArgs e) { if (rptDocument == null)
-
Web打印解决方案之证件套打的实现思路
在前面介绍过<Web打印解决方案之普通报表打印功能>的一片文章中提到过那个打印控件Lodop,做起套打来感觉还是挺方便的,至少位置调整界面不需要自己弄,位置嘛,也提供了自动保存的功能,不需要理会. 一般的套打,包含了几部分操作:打印预览.打印维护.打印设计. 打印预览和打印维护是面向终端用户的,打印维护是指内容不能修改删除.但位置可以调整,给不同的打印机不同的尺寸打印提供调整位置的可能性. 打印设计是面向开发人员的,开始需要通过这个功能来设计好套打的界面,就是根据套打证件的背景图片,大致摆放好
-
Web打印解决方案之普通报表打印功能
做过很多的Web项目,大多数在打印页面内容的时候,采用的都是通过Javascript调用系统内置的打印方法进行打印,也就是调用PrintControl.ExecWB(?,?)实现直接打印和打印预览功能.打印的效果及控制性虽然不是很好,但是也能勉强使用,应付一般的打印还是可以的了. 代码如下所示: 代码 Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->
-
JavaWeb实现图形报表折线图的方法
本文实例讲述了JavaWeb实现图形报表折线图的方法.分享给大家供大家参考,具体如下: 步骤说明: 1. 导入log4j.jar,jfreechart-0.9.18.jar,jdom.jar,jcommon-0.9.3.jar四个jar包 2. 在某个包中写入Tuxin.Java类 package com.mengya.util; import java.awt.Color; import java.awt.Font; import java.io.PrintWriter; import jav
-
extjs4图表绘制之折线图实现方法分析
本文实例讲述了extjs4图表绘制之折线图实现方法.分享给大家供大家参考,具体如下: 本篇文章将介绍extjs中自带的图表 在本次案例中,提供一下功能: 1.从后端请求数据并运用到图表中,形成动态数据. 2.查询出每年各个月中人数. 请看下面代码: Ext.define('ChartLineTest', { extend: 'Ext.panel.Panel', autoScroll : true, selectYear:null,//定义年份 initComponent: function ()
-
Android开发自定义控件之折线图实现方法详解
本文实例讲述了Android开发自定义控件之折线图实现方法.分享给大家供大家参考,具体如下: 前言 折线图是Android开发中经常会碰到的效果,但由于涉及自定义View的知识,对许多刚入门的小白来说会觉得很高深.其实不然,接下来我就以尽量通俗的语言来说明下图折线图效果的实现过程. 效果图 实现过程 首先,选择自定义控件的方式. 自定义控件的实现有四种方式: 1.继承View,重写onDraw.onMeasure等方法. 2.继承已有的View(比如TextView). 3.继承ViewGrou
-
jQuery实现折线图的方法
本文实例讲述了jQuery实现折线图的方法.分享给大家供大家参考.具体如下: 效果图如下所示: js引用: 复制代码 代码如下: <script src="Js/Index/jquery-1.5.2.min.js" type="text/javascript"></script> <script src="js/Index/raphael.2.1.0.min.js" type="text/javascri
-
Python基于Matplotlib库简单绘制折线图的方法示例
本文实例讲述了Python基于Matplotlib库简单绘制折线图的方法.分享给大家供大家参考,具体如下: Matplotlib画折线图,有一些离散点,想看看这些点的变动趋势: import matplotlib.pyplot as plt x1 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13] y1=[30,31,31,32,33,35,35,40,47,62,99,186,480] x2 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 1
-
Layer+Echarts构建弹出层折线图的方法
layer是一款口碑极佳的web弹层组件,她具备全方位的解决方案,致力于服务各个水平段的开发人员,您的页面会轻松地拥有丰富而友好的操作体验. 在中国可视化生态系统中,ECharts 通过提供方便丰富的可视化图表,极大缩短了用户与数据的距离.个人认为是最好用的可用来生成图表的插件. 现在使用Layer和Echarts构建弹出层折线图. 下载好所需要用到的工具包,Echarts下载为echarts.min.js,Layer在layer官网下载之后将layer文件夹放到项目之中. 在HTML文件中引入
-
Echarts教程之通过Ajax实现动态加载折线图的方法
一.GIF图 二.前台代码 // 调用方法 hotlineLine(); // 定时刷新 setInterval(function () { hotlineLine(); },5000); function hotlineLine(){ // 初始化图表元素 var hotlineLine = echarts.init(document.getElementById('hotlineLine_id')); $.get('${pageContext.request.getContextPath()
-
vue+echarts实现动态折线图的方法与注意
之前公司有个绘制实时盈利率折线图的需求,实现的还不错,今天来分享下vue+echarts实现动态折线图的方法. 实现代码 <template> <div id="myChart"></div> </template> <script> import echarts from 'echarts' export default { name: 'DynamicLineChart', data () { return { // 实时
-
jfreechart画折线图的方法
JFreeChart 是开放源代码站点SourceForge.net 上的一个 JAVA 项目,它主要用来各种各样的图表,这些图表包括:饼图.柱状图 ( 普通柱状图以及堆栈柱状图 ).线图.区域图.分布图.混合图.甘特图以及一些仪表盘等等. 应用jfreechart来画图需要两个jar包:jfreechart.jar和jcommon.jar,下载地址. 下面是一个画折线图的例子: package yuth.jfree.demo; /** * 使用 categoryDataset 数据集创建折线图
-
D3.js实现折线图的方法详解
前言 D3.js是一个帮助开发者操纵基于数据的文档的JavaScript类库,在<D3.js实现柱状图的方法详解>中已经给大家介绍过如何用D3.js来实现一个简单的柱状图了,今天我们来学习用D3.js来实现折线图,感兴趣的朋友们下面来一起看看吧. 折线图由坐标轴.线条和点组成.和实现柱状图一样,我们还是先把大概的画图框架搭起来,代码如下(别忘了添加D3.js): <!DOCTYPE html> <html lang="en"> <head>