jfreechart图表封装

V2.0的项目开始,卸下组长的责任投入了一个个小模块的技术研究里,一直以来技术研究好像是我的弱点,可能是因为平时积累不够的原因,但是这次顶着压力接下了这个任务,还是努力的去做了,尽管最终的结果可能不是很漂亮,但是至少还是迈出了一步。

废话少说,先说说我的需求:因为ITOO的系统中多个子系统都涉及到图表的使用,所以需要封装一个公共的方法来供各子系统调用,这次迭代主要完成的图表有:柱形图,折线图,饼形图;下面从底层封装开始写写我封装jfreechart图表的过程,并说一下它的不足,希望得到更多的指教。

第一步:

由于项目是用maven管理的,所以需要在itoo-tool的pom文件中引入jreechart要用到的jar包:

<!-- 图表引入jar包********陈丽娜*********start****2015-1-29****-->
		<dependency>
		      <groupId>jfreechart</groupId>
              <artifactId>jfreechart</artifactId>
              <version>${jfreechart.version}</version>
		</dependency>
<!-- 图表引入jar包********陈丽娜*********end****2015-1-29**** -->

第二步:

引入jar包之后就可以使用jfreechart相关的类与属性,这时候就可以封装图表工具类了,如下为工具类中的代码:

package com.tgb.itoo.tool.jfreechart;

import java.awt.Font;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.Serializable;
import java.security.KeyStore.Entry;
import java.text.NumberFormat;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;
import javax.xml.messaging.ReqRespListener;

import org.jfree.chart.ChartColor;
import org.jfree.chart.ChartFactory;
import org.jfree.chart.ChartUtilities;
import org.jfree.chart.JFreeChart;
import org.jfree.chart.axis.CategoryAxis;
import org.jfree.chart.axis.NumberAxis;
import org.jfree.chart.labels.StandardPieSectionLabelGenerator;
import org.jfree.chart.plot.CategoryPlot;
import org.jfree.chart.plot.PiePlot;
import org.jfree.chart.plot.PlotOrientation;
import org.jfree.chart.renderer.category.BarRenderer;
import org.jfree.chart.servlet.ServletUtilities;
import org.jfree.chart.title.TextTitle;
import org.jfree.data.category.CategoryDataset;
import org.jfree.data.category.DefaultCategoryDataset;
import org.jfree.data.general.DefaultPieDataset;

/**
 * 图表工具类封装
 * @author 陈丽娜
 * @version 1.0.0 , 2015年1月29日 下午3:28:54
 */
public class JfreeChartUntil {

	private JFreeChart chart;

	/**
	 * 柱状图公共方法
	 * @param title 柱状图标题
	 * @param xTitle 柱状图x轴
	 * @param yTitle 柱状图y轴
	 * @param map 需要生成图表的数据
	 * @param request 访问数据
	 * @return 返回一个图片地址
	 * @throws IOException 抛出异常
	 */
	public String getColumnChart(String title,String xTitle,String yTitle,Map<String , Integer> map,HttpServletRequest request) throws IOException{
		DefaultCategoryDataset dataset=new DefaultCategoryDataset();

		//取出横坐标要统计的数据,遍历传递过来的map数据
		 for (Map.Entry<String , Integer> entry : map.entrySet()) {
			//System.out.println("key= " + entry.getKey() + " and value= " + entry.getValue());
		   dataset.addValue(entry.getValue(), "", entry.getKey());

		 }
		//CategoryDataset dataset=getDataset2();
		//创建一个柱形图
		chart=ChartFactory.createBarChart3D(title, xTitle, yTitle, dataset, PlotOrientation.VERTICAL, false, false, false);
		CategoryPlot categoryPlot=chart.getCategoryPlot();
		BarRenderer barRenderer=(BarRenderer)categoryPlot.getRenderer();
		categoryPlot.setRangeGridlinePaint(ChartColor.DARK_BLUE);
		barRenderer.setMaximumBarWidth(0.06);  //定义柱形的宽度
	    //保存生成的图表为图片
	    String fileName=ServletUtilities.saveChartAsJPEG(chart, 700, 600, request.getSession());
	    //获取图片的路径
	    String chartURL=request.getContextPath()+"/chart?filename=" +fileName;
	    //返回图片路径
	    return chartURL;
	}

	/**
	 * 生成饼形图
	 * @param title 饼形图标题
	 * @param map 需要统计为饼形图的数据
	 * @param request 访问
	 * @return 返回jfreechart生成的图片地址
	 * @throws IOException 抛出异常
	 */
	public String getPieChart(String title,Map<String , Integer> map,HttpServletRequest request) throws IOException{
       DefaultPieDataset  dataset=new DefaultPieDataset();

		//取出横坐标要统计的数据,遍历传递过来的map数据
		 for (Map.Entry<String , Integer> entry : map.entrySet()) {
			dataset.setValue(entry.getKey(),entry.getValue());
		 }
		chart=ChartFactory.createPieChart(title, dataset, false, false, false);
		//获取饼形图对象
		PiePlot piePlot=(PiePlot)chart.getPlot();

		//饼形图显示百分比
		//{0}表示选项,{1}表示数值,{2}表示百分比
		StandardPieSectionLabelGenerator standarPieIG=new StandardPieSectionLabelGenerator(
				"{0}:({1},{2})", NumberFormat.getNumberInstance(), NumberFormat.getPercentInstance());

		//为饼形图设置对应的显示百分比格式
		piePlot.setLabelGenerator(standarPieIG);

		 //调用修改格式方法
	    //changeStyle(chart);
		 //保存生成的图表为图片
	    String fileName=ServletUtilities.saveChartAsJPEG(chart, 700, 600, request.getSession());
	    //获取图片的路径
	    String chartURL=request.getContextPath()+"/chart?filename=" +fileName;
	    //返回图片路径
	    return chartURL;
	}

	public String getLineChart(String title,String xTitle,String yTtitel,Map<String , Integer> map,HttpServletRequest request) throws IOException{
		DefaultCategoryDataset dataset=new DefaultCategoryDataset();
		//取出横坐标要统计的数据,遍历传递过来的map数据
		 for (Map.Entry<String , Integer> entry : map.entrySet()) {
			 dataset.addValue(entry.getValue(), "", entry.getKey());
		 }
		chart=ChartFactory.createLineChart(title, xTitle, yTtitel, dataset, PlotOrientation.VERTICAL, false, false, false);
		 //调用修改格式方法
	    //changeStyle(chart);
	    //保存生成的图表为图片
	    String fileName=ServletUtilities.saveChartAsJPEG(chart, 700, 600, request.getSession());
	    //获取图片的路径
	    String chartURL=request.getContextPath()+"/chart?filename=" +fileName;
	    //返回图片路径
	    return chartURL;
	}

}

其实大家也可以看出封装起来并不困难,但是就是这样的封装可以使每个想要使用图表的功能只需要传递标题和统计数据。

第三步:使用图表功能的模块需要在自己的web层中的web.xml中配置图片存放路径:

Web.xml:

 <!-- jfeechart配置*****2015-2-1****陈丽娜******start**** *************************-->
      <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>/chart</url-pattern>
    </servlet-mapping>
     <!-- jfeechart配置*****2015-2-1****陈丽娜******end**** *************************-->

第四步:

在使用图表功能的模块中的controller中写如下的代码:

@RequestMapping("/testJfreechart")
private void testJfreeChart(String jfreechart, HttpServletRequest request,HttpServletResponse response) throws Exception{
	//查询建筑工程学院下的所有课程
	String id="A6MNqDUqiXar2tmragammb";
    	List<CourseInfo> listCourseInfo=courseBean.queryAllCourseInfos(id);    

    	Map<String, Integer> map=new HashMap<String, Integer>();
    	//将查询出的list集合放到map中并统计数据
    	for(CourseInfo courseInfo : listCourseInfo){
    		if(courseInfo==null){
    			continue;
    		}
    		//获取课程类型相同的课程数
    		Integer count=map.get(courseInfo.getCourseType().getCourseTypeName());
    		if(count!=null){
    			map.put(courseInfo.getCourseType().getCourseTypeName(), count+1);
    		}else{
    			map.put(courseInfo.getCourseType().getCourseTypeName(), 1);
    		}
    	}
    	JfreeChartUntil jfreeChartUntil=new JfreeChartUntil();
    	jacksonJsonUntil=new JacksonJsonUntil();
    	String chartUrl="";
    	//chartUrl=jfreeChartUntil.getColumnChart("课程信息测试柱状图", "课程类型信息","课程数据", map,request);
    	//判断冲前台传递回来的jfreechart是什么类型
    	//如果为line则调用折线,如果是pie则调用饼形,如果是column则调用柱形
    	switch (jfreechart) {
	case "line":
		 chartUrl=jfreeChartUntil.getLineChart("课程信息测试折线图", "课程类型信息", "课程数据", map, request);
		 break;
	case "pie":
		 chartUrl=jfreeChartUntil.getPieChart("课程信息测试饼形图", map, request);
		 break;
	case "column":
		 chartUrl=jfreeChartUntil.getColumnChart("课程信息测试柱形图图", "课程类型信息", "课程数据", map, request);
		 break;
	default:
		break;
	}
    	//将生成的图表图片路径转成json并返回
    	jacksonJsonUntil.beanToJson(response, chartUrl);

}

第五步:

前台显示页面

 <!--图表demo 弹出框***************陈丽娜***********start********2015-2-6**** -->
	<div id="addone" class="easyui-dialog" style="width:700px;height:600px;padding:10px 20px"
           title="图表demo" closed="true" buttons="#dlg-buttons" >
            <div  id="sp"class="easyui-panel" style="padding:5px;">
			    <input type="radio" name="lang" value="column"><span>柱形图</span>
	            <input type="radio" name="lang" value="pie"><span>饼形图</span>
	            <input type="radio" name="lang" value="line"><span>折线图</span><br/>
			</div>

			<img id="test1"src=""  width=100% height=500 >

     </div>
   <!--图表demo 弹出框***************陈丽娜***********end**********2015-2-6**** -->
$(function(){
        $('#sp input').click(function(){
            var chart = $(this).val();
           // alert(chart);
            $("#test1").attr("src","");
    		$.ajax({
	    		//访问图表的controller
    			url:'testJfreechart?jfreechart='+chart,
    			//type:'post',
    			success:function(data)
    			{
    				//alert(data);
    				$("#test1").attr("src",data);
    			},
    			error:function(data){
    				alert( "图形分析失败,请联系管理员!");
    			}
    	});
        });
    });

大概是这样的,显示效果大概如下:

但是这样的图表有些不美观,没有向highcharts或者Echarts那么的有动感,所以觉得还是封装成Hightcharts或者是Echarts的图表比较高端,正在努力中。

时间: 02-13

jfreechart图表封装的相关文章

jfreechart的使用案例

一:下载需要的2个jar文件 jcommon-版本号.jar,jfreechart-版本号.jar,注意版本不要太高. 实例一:比较简单的application版本的饼图 1 /** 2 * 3 */ 4 package com.hlcui.jfreechart; 5 6 import java.awt.Font; 7 8 import org.jfree.chart.ChartFactory; 9 import org.jfree.chart.ChartFrame; 10 import org

JAVA平台开放图表绘制类库——JFreeChart

好的东西要分享要推荐,这里向大家推荐一个java平台下的一个开源图表绘制类库JFreeChart,相关资源(源代码.demo源码.开发指南)已经上传至CSDN资源,需要的可以自行下载. JFreeChart的图表绘制功能非常强大,涵盖了几乎所有想的到的图表,并且绘制效果还很炫酷.来看下JFreeChart的主要效果图: 之前都是用excel绘制的图表,还要调整很多属性之类的东西,觉得很麻烦,所以就全部模块化实现了,代码就不贴出来了. JFreeChart相关资源下载地址:http://downl

JFreeChart与AJAX+JSON+ECharts两种处理方式生成热词统计可视化图表

本篇的思想:对HDFS获取的数据进行两种不同的可视化图表处理方式.第一种JFreeChar可视化处理生成图片文件查看.第二种AJAX+JSON+ECharts实现可视化图表,并呈现于浏览器上.   对此,给出代码示例,通过网络爬虫技术,将上传到HDFS的新浪网新闻信息实现热词统计功能,通过图表的柱状图来显示出来. ------> 目录: 1.JFreeChart可视化处理(生成本地图片) [1]HDFS文件读取 [2]JDFreeChart库应用 2.AJAX+JSON+EChart生成可视化图

echart封装,前端简单路由,图表设置自动化

https://github.com/cclient/EhartDemoSetByAngular 后端node.js 前端插件 echart,jquery,jqueryui,datapicker,angularjs,tag-it bootstrap(这个坑死我,选型失误datapicker样式和bootstrap 不兼容,记录在http://www.cnblogs.com/zihunqingxin/p/4435815.html) 源码内容 封装了echart的 大地图(上级下级跳转,echar有

struts2中 JFreeChart使用

添加3个包 struts2-jfreechart-plugin-2.3.16.3.jar jcommon-1.0.16.jar jfreechart-1.0.13.jar struts.xml中配置 查看struts2-jfreechart-plugin-2.3.16.3.jar中的struts-plugin.xml文件 查看其中的定义的东西 然后写着struts.xml中 1 <package name="freechart" extends="jfreechart-

iOS:使用贝塞尔曲线绘制图表(折线图、柱状图、饼状图)

1.介绍: UIBezierPath :画贝塞尔曲线的path类 UIBezierPath定义 : 贝赛尔曲线的每一个顶点都有两个控制点,用于控制在该顶点两侧的曲线的弧度. 曲线的定义有四个点:起始点.终止点(也称锚点)以及两个相互分离的中间点. 滑动两个中间点,贝塞尔曲线的形状会发生变化. UIBezierPath :对象是CGPathRef数据类型的封装,可以方便的让我们画出 矩形 . 椭圆 或者 直线和曲线的组合形状 初始化方法: + (instancetype)bezierPath; /

使用angular封装echarts

Echarts是一个开源的图表组件,图表比较丰富,工作中需要用到它来搭建一个数据展示系统.但是系统原有的框架是基于angular的,而echarts是基于原生js的,如果直接使用的话就丢失了angular双向绑定的优势,而且后续代码不好维护,所以需要将echarts封装成一个通用的angular组件. echarts原生实现如下: <!-- 为ECharts准备一个具备大小(宽高)的Dom --> <div id="main" style="height:4

定时动态更新图表

在进行实现动态更新图表时主要使用AJAX技术,主要分两种实现方法,一种是通过ASP.NET特有的AJAX控件,UpdatePanel.Timer控件+ASP.NET自带的Chart控件实现:另一种为使用第三方的图表库+JQUERY\AJAX实现. ASP.NET控件实现 实现: 前台将要定时刷新的内容放到updatePanel中即可,前台代码如下: <form id="form1" runat="server"> <asp:ScriptManage

Echarts生成饼状图、条形图以及线形图 JS封装

1.在我们开发程序中,经常会用到生成一些报表,比方说饼状图,条形图,折线图等.不多说了,直接上封装好的代码,如下Echarts.js所示 以下代码是封装在Echarts.js文件中 /** * Created by Administrator on 2015/8/7. */ var charec; // 路径配置 require.config({ paths: { echarts: 'http://echarts.baidu.com/build/dist' } }); // 按需加载所需图表 r