echarts

Model模型:

/**
* element of Echarts series
* 通用的，若有其他的图表可以另外新建Model
*/
public class EchartModel {
   private String name;//系列名称
   private String type;//图表类型：'line'(折线图)|'bar'(柱状图)|'scatter'(散点图)|'k'(K线图) |'pie'(饼图)|'radar'(雷达图)|'chord'(和弦图)|'force'(力导向布局图)|'map'(地图)
   private int yAxisIndex;//左右Y轴：0左、1右
   private List<Object> data;//数据


   public EchartModel() {
   }
   public EchartModel(String name, String type,
           int yAxisIndex) {
       this.name = name;
       this.type = type;
       this.yAxisIndex = yAxisIndex;
   }
   public EchartModel(String name, String type,
           int yAxisIndex, List<Object> data) {
       this.name = name;
       this.type = type;
       this.yAxisIndex = yAxisIndex;
       this.data = data;
   }

   public String getName() {
       return name;
   }
   public void setName(String name) {
       this.name = name;
   }
   public String getType() {
       return type;
   }
   public void setType(String type) {
       this.type = type;
   }
   public int getyAxisIndex() {
       return yAxisIndex;
   }
   public void setyAxisIndex(int yAxisIndex) {
       this.yAxisIndex = yAxisIndex;
   }
   public List<Object> getData() {
       return data;
   }
   public void setData(List<Object> data) {
       this.data = data;
   }
}

控制器:

@RequestMapping(value = "/common/datacenter/nationalindustries/getData")
   @ResponseBody
   protected Map<String, Object> getData(@ModelAttribute CeDataCocalconsumeNationalindustriesModel queryModel,
            HttpServletResponse response) throws ServletException, IOException, ParseException {
       Map<String, Object> resultMap = new HashMap<String, Object>();

       queryModel.setOrderBy(" t.gatherTime desc");//时间降序、
       List<CeDataCocalconsumeNationalindustries> resultList = ceDataCocalconsumeNationalindustriesManager.listQuery(queryModel);//年度gdp结果集

       List<String> legendList = new ArrayList<String>();//图表外条件集
       List<String> yearList = new ArrayList<String>();//年份集
       List<EchartModel> echartSeriesList = new ArrayList<EchartModel>();//echars传输的数据集
       legendList.add("煤炭消费总量(万吨)");
       legendList.add("工业煤炭消费总量(万吨)");
       legendList.add("采掘业煤炭消费总量(万吨)");
       int legendIndex = 0;
       echartSeriesList.add(new EchartModel(legendList.get(legendIndex++), "bar", 0, new ArrayList<Object>()));
       echartSeriesList.add(new EchartModel(legendList.get(legendIndex++), "bar", 0, new ArrayList<Object>()));
       echartSeriesList.add(new EchartModel(legendList.get(legendIndex++), "bar", 0, new ArrayList<Object>()));
       for (CeDataCocalconsumeNationalindustries result : resultList) {
           String year = result.getGatherTime()+"";

           if (yearList.indexOf(year) == -1) {
               yearList.add(0, year);//因时间降序时间集循环填入数据
           }
           legendIndex = 0;
           echartSeriesList.get(legendIndex++).getData().add(0, result.getConsumeSum()==null ? 0 : result.getConsumeSum());
           echartSeriesList.get(legendIndex++).getData().add(0, result.getConsumeIndustry()==null ? 0 : result.getConsumeIndustry());
           echartSeriesList.get(legendIndex++).getData().add(0, result.getConsumeMine()==null ? 0D : result.getConsumeMine());
       }
       resultMap.put("legendDatas", legendList);
       resultMap.put("gatherTimes", yearList);
       resultMap.put("echartSeries", echartSeriesList);
        StringBuffer sb = new StringBuffer();
       sb.append("{"lend": "+MyJsonTools.toJson(legendList)+","companyName":" +MyJsonTools.toJson(gatherTimeList)+ ","data":" 　　　　　　　　　　　　+MyJsonTools.toJson(echartSeriesList)+"}");
       request.setAttribute("resultList", resultList);
       response.getWriter().println(sb);
   }

jsp：

（1）引入echarts插件

（2）摆放处

js:

　　　　　　　　　　option.legend.data=[];
                           var c = msg.companyName;
                              for (var i in c) {
                               option.xAxis[0].data[i]=c[i];   　　　　　　//这里需要写明x0轴的第几个数据
                               }
                           var lend= msg.lend;
                           for (var i in lend) {
                               option.legend.data[i]=msg.lend[i];
                               option.series[i]={name:msg.data[i].name,type:'line',data:msg.data[i].data};
                           }
                               if("发电标准煤耗" == msg.lend){
                               option.yAxis[0] = {name:'克/千瓦时',type:'value'};
                               }
                               if("煤折标煤单价" == msg.lend){
                                   option.yAxis[0] = {name:'元/吨',type:'value'};
                                   }
                               if("入厂标煤单价涨幅" == msg.lend){
                                   option.yAxis[0] = {name:'元/吨',type:'value'};
                                   }
                               if("发电耗用标煤量" == msg.lend){
                                   option.yAxis[0] = {name:'吨',type:'value'};
                                   }
                               echart.setOption(option,true);
                               $("#listForm").submit();

                       });
            });
        }
    );
});
</script>

option.legend.data=[];