SSM echarts 柱状图 动态加载

关键是数据结构，list还是map合适。数据格式，官网有样例。我们要做的就是后台处理好数据，按照指定的格式responseBody传到前台。

JSP

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>







	  
    

    
    

Controller

@RequestMapping("getEchartsData")
	@ResponseBody
	public Map getEchartsData() {
		/*例子中：x轴，y轴data数据都是数组型，注意处理格式，将两个data需要的数据分别以name/value存入map
		 * xAxis: {
        data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
	    },
	    yAxis: {},
	    series: [{
	        name: '销量',
	        type: 'bar',
	        data: [5, 20, 36, 10, 10, 20]
	    }]*/
		List name = new ArrayList();
		List value = new ArrayList();
		
		List list = auserService.getEchartsDataBall();
		//单独挑出两种数据的集合放入map
		for (EchartsDataBallBean echartsDataBallBean : list) {
			name.add(echartsDataBallBean.getName());//对应xAxis data
			value.add(echartsDataBallBean.getValue());//对应yAxis data
		}
		Map map = new HashMap();
		map.put("name", name);
		map.put("value", value);
		return map;
	}

Entity 这里设定属性名value/name为了后续饼状图共用这个实体类接收数据

package com.jk.quanxian.entity;

public class EchartsDataBallBean {
	private Integer value;
	private String name;
	public Integer getValue() {
		return value;
	}
	public void setValue(Integer value) {
		this.value = value;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	@Override
	public String toString() {
		return "EchartsDataBallBean [value=" + value + ", name=" + name + "]";
	}
	
	
	
}

Mapper.xml

  
    
    
  
  
    select d.C_Name as name, COUNT(u.C_Name) as value 
    from t_aty_dept d,t_aty_user u where d.C_ID = u.C_DEPT GROUP BY d.C_Name