（原创）Java 读取 Highcharts 中的图片
前言：项目中提出一个新需求，就将Highcharts中的图片读取到Excel中。并在前台做下载，当听到这功能，第一想法是需要由后台编写程序，将数据写道图片中。
虽然没做过但是也没觉得太难，毕竟前辈们肯定也做过类似的功能。但是后来发现Highcharts本身就可以导出图片，也能导出不同格式图片。
我突然觉得将Highcharts的图片流传到后台，在输出到Excel中不就可以了吗？于是开始了.....
第一步：首先要获取Highcharts中SVG对象，信息保存到 form表单中。
第二步：将SVG 转换成PNG格式
别问我为什么，因为报错！报错！报错... 不能直接解析SVG
所需要jar包
batik-all-1.7.jar
batik-transcoder-1.7.jar
xml-apis-ext-1.3.04.jar
链接: https://pan.baidu.com/s/1FkLvC7dnXdLla5FASpjEKw 提取码: 71aq 复制这段内容后打开百度网盘手机App，操作更方便哦
下面这段代码在网上找的，我能用，也就贴出来了
/**
* @Description: 将svgCode转换成png文件，直接输出到流中
* @Author:saiSQ
* @Since: 2013-11-4下午01:37:56
* @param svgCode
* svg代码
* @param outputStream
* 输出流
* 异常
* @throws IOException
* io异常
*/
public static void convertToPng(String svgCode, OutputStream outputStream){
try {
byte[] bytes = svgCode.getBytes("UTF-8");
PNGTranscoder t = new PNGTranscoder();
t.addTranscodingHint(PNGTranscoder.KEY_WIDTH, new Float(1024));//只要指定宽度即可，高度自动调整。
TranscoderInput input = new TranscoderInput(new ByteArrayInputStream(bytes));
TranscoderOutput output = new TranscoderOutput(outputStream);
t.transcode(input, output);
outputStream.flush();
}catch (Exception e){
e.printStackTrace();
}finally {
if (outputStream != null) {
try {
outputStream.close();
} catch (IOException e) {
e.printStackTrace();
}
}
}
}
第三步：将文件写入response 中，做页面下载（以上是我写的代码，安全起见，我复制下来时，删掉了部分代码，如果没有运行成功，下方留言，按照你的情况再做解答，这里只说个思路。勿怪，勿怪）
/** * 生成Excel 文档 */ @RequestMapping(value = "/downExcel",produces = "application/json;charset=UTF-8") public void createdExcel(HttpServletRequest request, HttpServletResponse response){ ByteArrayOutputStream byteArrayOut=null; HSSFWorkbook wb=null; OutputStream os=null; String svgCode=request.getParameter("svg"); try { //加载图片 byteArrayOut= new ByteArrayOutputStream(); convertToPng(svgCode,byteArrayOut); //加载图片 wb= new HSSFWorkbook(); HSSFSheet sheet1 = wb.createSheet("sheet1"); HSSFPatriarch patriarch = sheet1.createDrawingPatriarch(); /** dx1 - the x coordinate within the first cell.//定义了图片在第一个cell内的偏移x坐标，既左上角所在cell的偏移x坐标，一般可设0 dy1 - the y coordinate within the first cell.//定义了图片在第一个cell的偏移y坐标，既左上角所在cell的偏移y坐标，一般可设0 dx2 - the x coordinate within the second cell.//定义了图片在第二个cell的偏移x坐标，既右下角所在cell的偏移x坐标，一般可设0 dy2 - the y coordinate within the second cell.//定义了图片在第二个cell的偏移y坐标，既右下角所在cell的偏移y坐标，一般可设0 col1 - the column (0 based) of the first cell.//第一个cell所在列，既图片左上角所在列 row1 - the row (0 based) of the first cell.//图片左上角所在行 col2 - the column (0 based) of the second cell.//图片右下角所在列 row2 - the row (0 based) of the second cell.//图片右下角所在行 */ int line=23;//列 int row=12;//行exportProjectExcel HSSFClientAnchor anchor = new HSSFClientAnchor(0, 0, 0, 0,(short) 0, 0, (short) row, line); //插入图片 patriarch.createPicture(anchor, wb.addPicture(byteArrayOut.toByteArray(), HSSFWorkbook.PICTURE_TYPE_PNG)); //再图片下插入内容 HSSFRow hssfRow=null; HSSFCell hssfCell=null; String fileName = "xxxx名称.xls";// 文件名 setResponseHeader(response,fileName); os=response.getOutputStream(); // 输出文件 wb.write(os); } catch (Exception e) { e.printStackTrace(); }finally { try{ if(byteArrayOut!=null){ byteArrayOut.close(); } if(byteArrayOut!=null){ byteArrayOut.close(); } if(wb!=null){ wb.close(); } if(os!=null){ os.close(); } }catch (Exception e){ e.printStackTrace(); } } }
第四步：测试效果
浏览器
Excel
五：特别注意： Highcharts 导出来的图片有可能因为比例问题，会导致数据出现问题，需要修改一下 Highcharts 宽度即可
这是前端大佬写的，我也不太懂，大概意思就是初始化 Highcharts表的时候 修改他的宽度， （svg_width 这里设置成了全量，获取的是浏览器上显示Highcharts那一快区域的宽度。主要是不能设置成百分比，写死了又不好）
Highcharts.chart('container', {
chart: {
type: 'column',
width: svg_width
},
到此该功能基本能实现出来了，别看简单，花了我两天时间，在快要崩溃的时候，出现了奇迹。
