项目下载地址:
1.highcharts.js(本人是用的3.0.5) 下载地址:(jquery就自己下载吧)
2.依赖jar(可以在项目找到):
jar包说明(jar也可以在下面的网址里找到):
此处参考:
核心的处理jar包是batik-codec.jar,它是apache项目组下面的一个专门用来处理图形生成技术的开源产品:
apache batik :
apache fop :
apache xml graphics commons :
3.jsp页面
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>Test HighCharts
4.修改项目右下角默认的Highcharts.com
如图:
打开highcharts.js文件,找到下面框起来的部分,改为空值,即可。
修改后:
5.导出设置
1).highcharts默认的打印和下载都是英文提示,下面修改为中文。
打开exporting.js ,找到如图的部分(进去就能看见),进行修改。
2):highcharts的默认下载都是这个路径,下面修改成自己的url。
a.新建一个Servlet(还有其他方式,自己弄的Servlet,自己灵活选择吧)。
中文乱码解决方案也在代码里面。
HighChartsUtil,代码如下
package cn.zyc.servlet;import java.io.IOException;import java.io.StringReader;import java.util.Iterator;import java.util.List;import javax.servlet.ServletException;import javax.servlet.ServletOutputStream;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import org.apache.batik.transcoder.Transcoder;import org.apache.batik.transcoder.TranscoderException;import org.apache.batik.transcoder.TranscoderInput;import org.apache.batik.transcoder.TranscoderOutput;import org.apache.batik.transcoder.image.JPEGTranscoder;import org.apache.batik.transcoder.image.PNGTranscoder;import org.apache.commons.fileupload.FileItem;import org.apache.commons.fileupload.FileUploadException;import org.apache.commons.fileupload.disk.DiskFileItemFactory;import org.apache.commons.fileupload.servlet.ServletFileUpload;import org.apache.fop.svg.PDFTranscoder;public class HighChartsUtil extends HttpServlet { private static final long serialVersionUID = -6266398282087799188L; public HighChartsUtil() { } @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { super.doGet(req, resp); } @Override protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { /* * IE request.setCharacterEncoding("utf-8");// 注意编码 String type = * request.getParameter("type"); String svg = * request.getParameter("svg"); response.setCharacterEncoding("utf-8"); */ //highcharts会传入的四个参数width,type,svg,filename; String type = null; String svg = null; String filename = null; DiskFileItemFactory factory = new DiskFileItemFactory(); ServletFileUpload upload = new ServletFileUpload(factory); List items; try { items = upload.parseRequest(request); for (Iterator i = items.iterator(); i.hasNext();) { FileItem fileItem = (FileItem) i.next(); String field = fileItem.getFieldName(); if (field.equals("type")) { type = new String(fileItem.getString().getBytes( "ISO-8859-1"), "UTF-8"); // 转码 continue; } else if (field.equals("svg")) { svg = new String(fileItem.getString() .getBytes("ISO-8859-1"), "UTF-8"); continue; } else if (field.equals("filename")) { filename = new String(fileItem.getString().getBytes( "ISO-8859-1"), "UTF-8"); continue; } } System.out.println("type:" + type); System.out.println("svg:" + svg); System.out.println("filename:" + filename); ServletOutputStream out = response.getOutputStream(); if (null != type && null != svg) { svg = svg.replaceAll(":rect", "rect"); String ext = ""; Transcoder t = null; if (type.equals("image/png")) { ext = "png"; t = new PNGTranscoder(); } else if (type.equals("image/jpeg")) { ext = "jpg"; t = new JPEGTranscoder(); } else if (type.equals("application/pdf")) { ext = "pdf"; t = new PDFTranscoder(); } else if (type.equals("image/svg+xml")) { ext = "svg"; } response.addHeader("Content-Disposition", "attachment; filename=chart." + ext); response.addHeader("Content-Type", type); if (null != t) { TranscoderInput input = new TranscoderInput( new StringReader(svg)); TranscoderOutput output = new TranscoderOutput(out); try { t.transcode(input, output); } catch (TranscoderException e) { out.print("编码流错误."); e.printStackTrace(); } } else if (ext == "svg") { svg = svg.replace("http://www.w3.org/2000/svg", "http://www.w3.org/TR/SVG11/"); out.print(svg); } else { out.print("Invalid type: " + type); } } else { response.addHeader("Content-Type", "text/html"); } out.flush(); out.close(); } catch (FileUploadException e1) { e1.printStackTrace(); } }}
b.配置xml
Test HighCharts highCharts cn.zyc.servlet.HighChartsUtil highCharts /highChartServlet index.jsp
c.修改exporting.js
把url : 修改为我们自己的url : 。
改后,默认下载路径为:
d.由于我是在Chrome下进行的测试,在IE下还得进行如下设置:
此处参考:
修改exporting.js,加上红框里的那句。