ECHARTS

java服务端生成echarts图片,并将图片保存至服务器

前言:最近公司有这样一个需求,对公司的统计数据使用图表进行展示,并且支持word导出,word文档中需要包含思路分析:首先看到图表,第一步就想到echarts或highcharts,但是我们一般使用前面2个图表软件默认需要使用html,运行在浏览器中,如果我们需要将统计图表通过word导出,首先需要将图片生成并写入到word中,那么我们现在的第一步就变成了,使用java生成echarts图表并保存

前言:

最近公司有这样一个需求,对公司的统计数据使用图表进行展示,并且支持word导出,word文档中需要包含


思路分析:

首先看到图表,第一步就想到echarts或highcharts,但是我们一般使用前面2个图表软件默认需要使用html,运行在浏览器中,如果我们需要将统计图表通过word 导出,首先需要将图片生成并写入到word中,那么我们现在的第一步就变成了,使用java生成echarts图表并保存。既然echart需要运行在浏览器端,而且我们服务端又没有浏览器,那么我们可以通过使用无界面的浏览器来解决问题,既然总体思路确定了,那么我们就想到了无界面浏览器phantomjs.


phantomjs是什么

PhantomJS是一个基于webkit的JavaScript API。它使用QtWebKit作为它核心浏览器的功能,使用webkit来编译解释执行JavaScript代码。任何你可以在基于webkit浏览器做的事情,它都能做到。它不仅是个隐形的浏览器,提供了诸如CSS选择器、支持Web标准、DOM操作、JSON、HTML5、Canvas、SVG等,同时也提供了处理文件I/O的操作,从而使你可以向操作系统读写文件等。PhantomJS的用处可谓非常广泛,诸如网络监测、网页截屏、无需浏览器的 Web 测试、页面访问自动化等。


PhantomJS官方地址:http://phantomjs.org/。

PhantomJS官方API:http://phantomjs.org/api/。

PhantomJS官方示例:http://phantomjs.org/examples/。

PhantomJS GitHub:https://github.com/ariya/phantomjs/


1 phantomjs的安装

我们从phantomjs官网下载后,解压放入不要放入带有中文的目录中(中国程序员永远的痛),

 并加入到环境变量path中,方便程序调用。

2fc9eac40bc3ece159e038825f3dda77.png

配置环境变量:

44c7f723164af5e97c50a105382e89bf.png

2 下载相关脚本

  2.1 echarts.min.js

 这个脚本可以从echarts官网下载


https://echarts.apache.org/zh/index.html


2.2  jquery.js

这个脚本可以通过jquery官网下载


https://jquery.com/


2.3 echarts-convert.js

此脚本很重要,内容如下:负责将echarts的抓换,内容如下:

(function() {  
    var system = require('system');  
    var fs = require('fs');  
    var config = {  
        // define the location of js files  
        JQUERY : 'jquery-1.9.1.min.js',  
        ECHARTS3 : 'echarts/echarts-all4.js',
        //ECHARTS3 : 'echarts.min_4.js',
        // default container width and height
        DEFAULT_WIDTH : '1000',
        DEFAULT_HEIGHT : '600'
    }, parseParams, render;
  
    usage = function() {  
        console.log("\nUsage: phantomjs echarts-convert.js -options options -outfile filename -width width -height height"  
                        + "OR"  
                        + "Usage: phantomjs echarts-convert.js -infile URL -outfile filename -width width -height height\n");  
    };  
  
    pick = function() {  
        var args = arguments, i, arg, length = args.length;  
        for (i = 0; i < length; i += 1) {  
            arg = args[i];  
            if (arg !== undefined && arg !== null && arg !== 'null' && arg != '0') {  
                return arg;  
            }  
        }  
    };  
    var base64Pad = '=';
    var toBinaryTable = [-1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, -1, 62, -1, -1, -1, 63,
                         52, 53, 54, 55, 56, 57, 58, 59, 60, 61, -1, -1, -1, 0, -1, -1, -1, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14,
                         15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, -1, -1, -1, -1, -1, -1, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40,
                         41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, -1, -1, -1, -1, -1
                     ];
    base64ToString = function(data) { 
    	//console.log("data  = "+data);
        var result = '';  
        var leftbits = 0; // number of bits decoded, but yet to be appended    
        var leftdata = 0; // bits decoded, but yet to be appended   
        // Convert one by one.                                                                               
        for (var i = 0; i < data.length; i++) {
        	var c = toBinaryTable[data.charCodeAt(i) & 0x7f];  
        	//console.log("i  = "+c);
            var padding = (data.charCodeAt(i) == base64Pad.charCodeAt(0));  
            // Skip illegal characters and whitespace    
            if (c == -1) continue;  
  
            // Collect data into leftdata, update bitcount    
            leftdata = (leftdata << 6) | c;  
            leftbits += 6;  
  
            // If we have 8 or more bits, append 8 bits to the result   
            if (leftbits >= 8) {  
                leftbits -= 8;  
                // Append if not padding.   
                if (!padding)  
                    resul

原创不易,完成人机校验,阅读全文

相关推荐