zoukankan      html  css  js  c++  java
  • 在JSP中利用JFreechart生成各种图表

      一个java新手编写web网页时遇到一个问题,就是取出数据库里的某个表的内容并将其生成柱状图或者折线图,这突然就比较迷茫,不知应该怎样完成,但静下心来想了想思路,首先我应该知道要生成图表有哪些路可寻,通过上网发现了大神总结的心得如下(原文):

    https://blog.csdn.net/happylee6688/article/details/26960729

    • ChartDirector
      ChartDirector 是一款商业的图表库,有多种语言的版本,支持的版本有有.NET,ASP/COM/VB,JSP/Java,CodeFusion,PHP,Perl,Ruby,C++等。ChartDirector图表工具尤其适合用于Web及嵌入式应用程序开发。使用它做的图表非常的精细漂亮,虽然是商业图表,但其收费并不算贵,当然,如果你不想花钱购买,它也提供了免费版本,但在生成的图表上会出现logo信息。不过,网上还是有很多的破解方法的,很简单。
      ChartDirector 插件使用方便,快捷,灵活,功能强大,交互性强。在Web服务器以及嵌入式应用程序开发中,它是一种非常理想的工具,拥有丰富的图表图形组件库。支持多种图表样式,如圆形图表(饼形图),圆环图,柱形图(条形图),直线图,曲线图,梯形线图,趋势线图,曲线拟合图,线间色图,区域图,泡沫图等等。采用多线程结构,特别应用于具有高性能要求的服务器端应用程序开发,拥有基于API(应用编程接口)的对象,允许用户控制和定制图表细节,从而设计出用户满意的图表。
      ChartDirector 对中文的支持也是很不错的,出现的问题很容易解决,网上都有解决方案。此外,ChartDirector 提供的源码中,jsp的demo也是比较简单的,你只需要改一下数据,马上就可以呈现出你想要的效果。而且还备有英文的文档,文档中提供了源代码的说明,对于开发人来说还是很方便的。就我个人来说,我还是很喜欢这一款插件的,图形种类繁多,样式漂亮,而且上手也很简单。
    • JScharts 
      JScharts 是一个用来在浏览器上直接绘制图表的JavaScript工具包。支持柱状图,圆饼图以及简单的曲线图。直接将这个库插入网页,然后从 XML 文件或 JavaScript 数组变量调用数据。
    JSCharts 的特点是,它不需要任何服务端的插件和模块,是纯JavaScript组件,它是一款商业软件,但提供了免费的版本(含有水印)。如要删除水印,需要一个域密钥。正常情况下,JScharts是不支持中文的,不过在网上找到一个解决方案,可以试一下,点击这里 。
    • JFreeChart
      JFreeChart 是一个开源的Java项目,它主要用来开发各种各样的图表,这些图表包括,饼形图、柱状图(普通柱状图以及堆栈柱状图)、线图、区域图、分布图、混合图、甘特图以及一些仪表盘等等。在这些不同样式的图表上可以满足目前商业系统的要求。
      JFreeChart是一种基于Java语言的图表开发技术,可以用于Servlet、JSP、Applet、Java Application 环境中,通过JDBC可动态显示任何数据库数据,结合ltext可以输出至PDF文件。JFreeChart 画出来的图形不够精细,看起来有些模糊,图表的文字边缘、颜色和颜色的分界也比较模糊。JFreeChart 对中文的支持不是很好,虽然有字体的解决办法,但仍然存在问题。它使用的默认字体显示出来的中文会很模糊,你可能需要修改源代码。
     
      对比这三款Java图表插件,ChartDirector 提供的图形样式是最多的,也是最漂亮的,毕竟是商业软件,对于另外两种还是有一些优势的。虽然免费版本的图表会有logo信息,不过对于这个网上有解决方案,可以去掉logo。对开发人员来说,ChartDirector 提供了很多的Demo和文档,足够开发人员学习和使用了。
      JScharts 也提供了一些日常常用的图形样式,包括柱状图、饼形图等等。而且它提供的样式也还是不错的。虽然JScharts 不需要任何服务端的插件和模块,但是对Web前端的JavaScript有一定的要求,不了解JavaScript的开发者是没办法使用的。当然,如果了解JavaScript的话,使用JScharts开发图表还是很简单的。
      JFreeChart 也提供了一些日常常用的图形样式,只不过它只支持java语言,在易用性方面还是很简单的。样式方面也还是可以的。虽然JFreeChart的文档要收费,但好在国内还有很多人在使用JFreeChart,网上可以找到很多相关的使用教程。JFreeChart的缺陷就是只适合生成图片,而且文字、图片都不是特别清晰,还需要进行一些调整。////////
      因为是java开发web 所以决定学习JFreeChart ,步骤:
    一:Jfreechart下载,下载地址:http://sourceforge.net/projects/jfreechart/files/ 下载 jfreechart-1.0.19.zip , 解压后从lib文件下找出jfreechart.jar和jcommon.jar这俩个来复制(其它干什么的不清楚)粘贴到WEB-INFlib下即可
    二:编写代码

    <%@ page pageEncoding="UTF-8"
    contentType="text/html; charset=UTF-8"%>
    <%@ page import="java.awt.Color,
    org.jfree.chart.ChartFactory,
    org.jfree.chart.JFreeChart,
    org.jfree.chart.plot.PlotOrientation,
    org.jfree.chart.servlet.ServletUtilities,
    org.jfree.data.category.CategoryDataset,
    org.jfree.data.general.*,
    org.jfree.chart.plot.CategoryPlot,
    org.jfree.chart.axis.CategoryAxis,
    org.jfree.chart.axis.ValueAxis,
    org.jfree.chart.renderer.category.BarRenderer3D,
    org.jfree.chart.urls.StandardCategoryURLGenerator,
    org.jfree.chart.*,
    org.jfree.chart.entity.*,
    org.jfree.chart.labels.*,
    org.jfree.chart.axis.CategoryLabelPositions,
    java.awt.Font,
    java.awt.GradientPaint,
    org.jfree.ui.TextAnchor,
    org.jfree.chart.axis.NumberAxis,
    org.jfree.chart.axis.NumberTickUnit
    "%>
    <%@ page import="org.jfree.data.general.DefaultPieDataset"%>
    <%@ page import="org.jfree.data.category.CategoryDataset" %>
    <%@ page import="org.jfree.data.category.DefaultCategoryDataset" %>
    <%@ page import="org.jfree.chart.JFreeChart"%>
    <%@ page import="org.jfree.chart.plot.PiePlot"%>
    <%@ page import="org.jfree.chart.ChartRenderingInfo"%>
    <%@ page import="org.jfree.chart.servlet.ServletUtilities"%>
    <%@ page import="org.jfree.chart.urls.StandardPieURLGenerator"%>
    <%@ page import="org.jfree.chart.entity.StandardEntityCollection"%>
    <%@ page import="org.jfree.chart.encoders.SunPNGEncoderAdapter"%>
    <%@ page import="org.jfree.chart.StandardChartTheme"%>
    <%@ page import="org.jfree.chart.ChartFactory"%>
    <%@ page import="org.jfree.chart.plot.CategoryPlot"%>
    <%@ page import="org.jfree.chart.plot.PlotOrientation"%>
    <%@ page import="org.jfree.chart.axis.CategoryAxis"%>
    <%@ page import="org.jfree.chart.renderer.category.BarRenderer"%>
    <%@ page import="org.jfree.chart.labels.StandardCategoryItemLabelGenerator"%>
    <%@ page import="java.awt.Font"%>
    <%@ page import="java.awt.Color"%>
    <%@ page import="java.sql.*"%>
    <%@ page import="java.util.*"%>
    <%@ page import="java.awt.*"%>
    <%@ page import="java.io.*"%>
    <%@ page import="org.jfree.chart.axis.CategoryAxis3D"%>
    <%@ page import="org.jfree.chart.axis.CategoryLabelPositions"%>
    <%@ page import="org.jfree.chart.axis.CategoryAxis3D"%>
    <%@ page import="org.jfree.chart.axis.NumberAxis3D"%>
    <%@ page import="org.jfree.chart.axis.NumberTickUnit"%>
    <%@ page import="org.jfree.chart.renderer.category.BarRenderer3D"%>
    <%@ page import="org.jfree.chart.renderer.category.BarRenderer3D" %>
    <%@ page import="org.jfree.chart.renderer.category.LineAndShapeRenderer" %>
    <%@ page import="org.jfree.data.category.DefaultCategoryDataset" %>
    <%@ page import="org.jfree.chart.plot.DatasetRenderingOrder" %>

    //PS:一个新手就尽可能的导入类,以防出错.....

    //饼状图代码如下:

    <html>
    <body>
    <%
    //实例化核心类对象
    DefaultPieDataset dataset=new DefaultPieDataset();
    //设置图表值,可为多个
    dataset.setValue("paid",45);
    dataset.setValue("Unpaid",25);
    //根据JFreeChart提供的工厂类org.jfree.chart.ChartFactory创建饼状图
    JFreeChart chart=ChartFactory.createPieChart3D("Student payment form",dataset,true,false,false);

    //生成图形存入session,得到存入session的图形名称

    String filename=ServletUtilities.saveChartAsPNG(chart,500,400,session);

    //在页面中通过img展示生成的图形,通过jfreechart的servlet输出图形
    String graphURL=request.getContextPath()+"/DisplayChart?filename="+filename;
    %>
    <img src="<%=graphURL %>" >
    </body>
    </html>

    以上输出图表的方法是用JFreeChart的serverlet进行输出,所以要配置web.xml文件,如下:(如果图表不显示,多半是web.xml没有配置)

    <?xml version="1.0" encoding="UTF-8"?>
    <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
    <display-name>ceshi</display-name>
    <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
    </welcome-file-list>

    <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>
    </web-app>

    事实上,图表输出是有俩种方式,另一种是通过一个函数输出:(柱状图为例)

    //第一步,构造一个Dataset :填充要统计的数据
    DefaultCategoryDataset mDataset = new DefaultCategoryDataset();
    mDataset.addValue(2000, "清华大学", "本科生"); //数据一般从数据库得出,用个for循环即可
    mDataset.addValue(1500, "清华大学", "研究生");
    mDataset.addValue(1000, "清华大学", "博士生");
    mDataset.addValue(900, "清华大学", "讲师");
    mDataset.addValue(800, "清华大学", "副教授");
    mDataset.addValue(300, "清华大学", "教授");
    mDataset.addValue(600, "清华大学", "行政人员");
    mDataset.addValue(400, "清华大学", "管理人员");
    //第二步,生成图形,ChartFactory.createBarChart3D来生成柱状图
    JFreeChart mChart = ChartFactory.createBarChart3D(
    "学校人员分布图", // 图形名称
    "类型", // 分类名称,为横坐标名称
    "数量", // 值名称,为纵坐标名称
    mDataset, // 数据集合
    PlotOrientation.VERTICAL, // 垂直显示
    true, // 是否显示图例
    true,// 是否使用工具提示
    false);// 是否使用url

    //第三,显示,有俩种方法:流式输出与URL(上面已经讲了)输出
    response.setContentType("image/png");
    //流式输出
    ChartUtilities.writeChartAsPNG(response.getOutputStream(),mChart,800,500);

    //////////////////////////////////////////////////////

    按理说,图表核心输出就已经学会了,但从上文得知,JFreeChart是不支持中文,会出现乱码,如果图表中的参数用英文,上面代码足以应付

    如果想输出中文而且还不显示乱码,那必须要自己再配置,如下:

    // 配置字体
    Font xfont = new Font("宋体", Font.PLAIN, 12);// X轴
    Font yfont = new Font("宋体", Font.PLAIN, 12);// Y轴
    Font kfont = new Font("宋体", Font.PLAIN, 12);// 底部
    Font titleFont = new Font("宋体", Font.BOLD, 25); // 图片标题
    // 图形的绘制结构对象,对于饼图不适用
    CategoryPlot plot = mChart.getCategoryPlot();

    // X 轴
    CategoryAxis domainAxis = plot.getDomainAxis();
    domainAxis.setLabelFont(xfont);// 轴标题
    domainAxis.setTickLabelFont(xfont);// 轴数值
    domainAxis.setTickLabelPaint(Color.BLACK); // 字体颜色

    // Y 轴
    ValueAxis rangeAxis = plot.getRangeAxis();
    rangeAxis.setLabelFont(yfont);
    rangeAxis.setLabelPaint(Color.BLACK); // 字体颜色
    rangeAxis.setTickLabelFont(yfont);

    这样就解决乱码了,上边的代码适用柱状图,设置字体, 
    对于折线图、饼图设置字体 的代码不太一样,需要单独对不同类型的图形设置字体,但都非常类似。

    用户的一般需求上面的一些思路就足以,但有时想输出一些综合的图表,比如柱状图与折线图一起输出,甚至是柱状图与很多折线图一起输出,

    网上也有很多例子,顺带着上面的思想也可以学习折线图。

    综合图参考链接:

    http://blog.sina.com.cn/s/blog_906e353d0101241e.html

    https://blog.csdn.net/sb_jb/article/details/77867614?fps=1&locationNum=2

  • 相关阅读:
    PAT (Advanced Level) 1010. Radix (25)
    PAT (Advanced Level) 1009. Product of Polynomials (25)
    PAT (Advanced Level) 1008. Elevator (20)
    PAT (Advanced Level) 1007. Maximum Subsequence Sum (25)
    PAT (Advanced Level) 1006. Sign In and Sign Out (25)
    PAT (Advanced Level) 1005. Spell It Right (20)
    PAT (Advanced Level) 1004. Counting Leaves (30)
    PAT (Advanced Level) 1001. A+B Format (20)
    PAT (Advanced Level) 1002. A+B for Polynomials (25)
    PAT (Advanced Level) 1003. Emergency (25)
  • 原文地址:https://www.cnblogs.com/wcher/p/8931707.html
Copyright © 2011-2022 走看看