使用Java语言画EChats图表

最近公司提出要重新设计网站，写一个报告，用于打印各种统计图标的报告。决定用echats做各种图标，由于web开发使用的是spring mvc框架，直接把图表写在js里又不好传递各种复杂数据，只好使用echats的java类库把图标组装好并填好数据再通过控制器传到前端页面直接展示。所有图表都是类似写法，主要是数据的填装。
由于官方并没有java类库的封装，所以有些java类库并没有一些复杂图表的封装，这时我们其实也可以自己组装需要的json字符串使用，以下图表为例：

---

下载jar包
http://git.oschina.net/free/ECharts
百度ECharts地址
http://echarts.baidu.com/
java类库维护者
http://blog.csdn.net/isea533/article/details/43225717

对象转为字符串要依赖gson，如果不转也可不用

画仪表盘图

option = new GsonOption();
        //tooltip
        option.tooltip().formatter("{a} <br/>{b} : {c}%");
        //series
        Gauge gauge = new Gauge();
        Detail detail = new Detail();
        detail.formatter("{value}%");
        MapData data = new MapData("指数值", 50);
        gauge.name("指数值").detail(detail).data(data);
        option.series(gauge);

画折线图

option = new GsonOption();
        //title
        option.title().setText("折线图");
        //tooltip
        option.tooltip().trigger(Trigger.axis);
        //legend
        option.legend().setData(legendList);
        //grid
        Grid grid = new Grid();
        grid.setLeft("3%");
        grid.setRight("4%");
        grid.setBottom("3%");
        grid.setContainLabel(true);
        option.setGrid(grid);
        //xAxis
        CategoryAxis xAxis = new CategoryAxis();
        xAxis.setBoundaryGap(false);
        xAxis.setData(xAxisData);
        option.xAxis(xAxis);//设置X轴变量
        //yAxis
        ValueAxis yAxis = new ValueAxis();
        option.yAxis(yAxis);
        //series
        List<Series> series = new ArrayList<>();
        for (int i = 0; i < legendList.size(); i++) {
            Line line = new Line();
            line.setName((String) legendList.get(i));
            line.setStack("总量");
            line.setData(data.get(i));
            series.add(line);
        }
        option.setSeries(series);

画单柱状图

option = new GsonOption();
        //title
        option.title().setText("邮件营销统计  ");
        //color
        option.color("#3398DB");
        //tooltip
        option.tooltip().trigger(Trigger.axis);
        option.tooltip().axisPointer().type(PointerType.shadow);
        //grid
        Grid grid = new Grid();
        grid.setLeft("3%");
        grid.setRight("4%");
        grid.setBottom("3%");
        grid.setContainLabel(true);
        option.setGrid(grid);
        //xAxis
        CategoryAxis xAxis = new CategoryAxis();
        xAxis.setData(xAxisData);
        option.xAxis(xAxis);
        //yAxis
        ValueAxis yAxis = new ValueAxis();
        option.yAxis(yAxis);
        //series
        Bar bar = new Bar();
        bar.setName((String) legendList.get(0));
        bar.setBarWidth(60);
        bar.setData(data.get(0));
        option.series(bar);

画多柱状图

 option = new GsonOption();
        //title
        option.title().setText("营销方案");
        option.title().setSubtext("随机数据");
        //tooltip
        option.tooltip().trigger(Trigger.axis);
        option.tooltip().axisPointer().type(PointerType.shadow);
        //legend
        option.legend().setData(barsLegendList);
        //grid
        Grid grid = new Grid();
        grid.setLeft("3%");
        grid.setRight("4%");
        grid.setBottom("3%");
        grid.setContainLabel(true);
        option.setGrid(grid);
        //yAxis
        ValueAxis yAxis = new ValueAxis();
        yAxis.boundaryGap(0, 0.01);
        option.yAxis(yAxis);
        //xAxis
        CategoryAxis xAxis = new CategoryAxis();
        xAxis.setData(xAxisData);
        option.xAxis(xAxis);
        //series
        List<Series> series = new ArrayList<>();
        for (int i = 0; i < barsLegendList.size(); i++) {
            Bar bar = new Bar();
            bar.setName((String) barsLegendList.get(i));
            bar.setData(barsData.get(i));
            series.add(bar);
        }
        option.setSeries(series);

画条形堆积图

 option = new GsonOption();
        //tooltip
        option.tooltip().trigger(Trigger.axis);
        option.tooltip().axisPointer().type(PointerType.shadow);
        //legend
        option.legend().setData(legendList);
        //grid
        Grid grid = new Grid();
        grid.setLeft("3%");
        grid.setRight("4%");
        grid.setBottom("3%");
        grid.setContainLabel(true);
        option.setGrid(grid);
        //xAxis
        option.xAxis(new ValueAxis());
        //yAxis
        CategoryAxis yAxis = new CategoryAxis();
        yAxis.setData(xAxisData);
        option.yAxis(yAxis);
        //series
        List<Series> series = new ArrayList<>();
        for (int i = 0; i < legendList.size(); i++) {
            Bar bar = new Bar();
            bar.setName((String) legendList.get(i));
            bar.setStack("总量");
            ItemStyle lable = new ItemStyle();
            lable.normal().show(true);
            bar.label(lable);
            bar.setData(data.get(i));
            series.add(bar);
        }
        option.setSeries(series);

画平行坐标轴图（自己组装json字符串）

 JSONObject stackedOption = new JSONObject();
        try {
            //legend
            JSONObject legend = new JSONObject();
            //legend里面的data
            JSONArray data = new JSONArray();
            for (Object s : legendList) {
                data.put(s);
            }
            legend.put("data", data);
            stackedOption.put("legend", legend);
            //parallelAxis
            JSONArray parallelAxis = new JSONArray();
            for (int i = 0; i < barsLegendList.size() + 1; i++) {
                JSONObject temp = new JSONObject();
                temp.put("dim", i);
                if (i < barsLegendList.size()) {
                    temp.put("name", barsLegendList.get(i));
                } else {
                    temp.put("name", "日期");
                    temp.put("inverse", true);
                    temp.put("type", AxisType.category);
                    JSONArray dataJson = new JSONArray();
                    for (int j = 0; j < xAxisData.size(); j++) {
                        dataJson.put(xAxisData.get(j));
                    }
                    temp.put("data", dataJson);
                }
                parallelAxis.put(temp);
            }
            stackedOption.put("parallelAxis", parallelAxis);
            //parallel
            JSONObject parallel = new JSONObject();
            parallel.put("left", "13%");
            parallel.put("top", "20%");
            stackedOption.put("parallel", parallel);
            //series
            JSONArray series = new JSONArray();
            for (int i = 0; i < legendList.size(); i++) {
                JSONObject temp1 = new JSONObject();
                temp1.put("name", legendList.get(i));
                temp1.put("type", "parallel");
                JSONArray dataA = new JSONArray();
                for (int j = 0; j < xAxisData.size(); j++) {
                    JSONArray dataATemp = new JSONArray();
                    for (int k = 0; k < barsLegendList.size(); k++) {
                        int rand = (int) (Math.random() * 60);//0-60随机数
                        dataATemp.put(rand);
                    }
                    dataATemp.put(xAxisData.get(j));
                    dataA.put(dataATemp);
                }
                temp1.put("data", dataA);
                series.put(temp1);
            }
            stackedOption.put("series", series);
        } catch (JSONException e) {
            e.printStackTrace();
        }

源码下载