Echarts的使用,异步加载数据及返回数据类型_echart 图前端返回值类型定义

前台js创建图形

var option1={
    	        title : {
    	          text: '学历统计',
    	          x:'center',
    	          y:'center'
    	        },
    	        series: [{
    	          type: 'pie',
    	          clockwise:false,
    	          radius:['45%','75%'],
    	          label: {
    	            normal: {
    	              show: true,
    	              formatter: '{b}，{c}',
    	              rich: {}
    	            }
    	          }
    	        }],
    	        color:['#27AAE1','#0071BC','#83B15A','#FBB040','#BE1E2D','#C6E579','#fad797'],
    	        textStyle:{
    	          color:'#333',
    	          fontSize:16
    	        }
    	      }
    	  chart1.setOption(option1);
    	  var unitId=document.getElementById("selectUnit").value;
        //异步加载数据
        $.ajax({
        	url:path+"/unitConditionController/getDegreeData.do?unitId="+unitId,
        	type:'post',
        	dataType:'json',
        	async:false,
        	success:function(data){
                chart1.setOption({
                    series:[{
                      data:data,//接受后台返回的数据，需要注意数据类型
                    }]
                  });
        	},
        	error:function(){
        		
        	}
        })

controller层：

/**
	 * 获取学历信息
	 * @param unitId
	 * @return
	 */
	@RequestMapping(value="/getDegreeData", method = { RequestMethod.POST })
	@ResponseBody
	public List<Map<String, Object>> getDegreeData(@RequestParam("unitId") String unitId){
		    List<Map<String,Object>> list=new ArrayList<Map<String,Object>>();
			Map<String,Object> map1=new HashMap<String,Object>();
			map1.put("unitId",unitId);
			List<PersonBaseInfoDTO> personBaseInfoDTOs=personBaseInfoService.searchListByCondition(map1);
			list=unitConditionService.getDegreeList(personBaseInfoDTOs);
	        return list;
		}

serviceImpl

数据存在一个map类型的list集合中,返回json数据，加@ResponseBody注解

 /**
     * 获取学历信息
     */
	@Override
	public List<Map<String, Object>> getDegreeList(List<PersonBaseInfoDTO> personBaseInfoDTOs) {
		List<Map<String,Object>> list=new ArrayList<Map<String,Object>>();
		int twen=0;
		int btt=0;
		int btf=0;
		int bff=0;
		int bfs=0;
		int os=0;
		int k=0;
		for(PersonBaseInfoDTO pDTO:personBaseInfoDTOs){				
			if(pDTO.getDegreeStatus()!=null){
				String degree=pDTO.getDegreeStatus();
				if(degree.equals("研究生")){
					twen++;
				}else if (degree.equals("硕士")) {
					btt++;
				}else if (degree.equals("本科")) {
					btf++;
				}else if (degree.equals("自考本科")) {
					bff++;
				}else if (degree.equals("大专")) {
					bfs++;
			    }else if(degree.equals("博士")){
					os++;
				}else if(degree.equals("其他")){
					k++;
				}
			}								
	 }
     Map<String,Object> map=new HashMap<String,Object>();
     map.put("name","研究生");
     map.put("value",twen);
     Map<String,Object> map2=new HashMap<String,Object>();
     map2.put("name","硕士");
     map2.put("value",btt);
     Map<String,Object> map3=new HashMap<String,Object>();
     map3.put("name","本科");
     map3.put("value",btf);
     Map<String,Object> map4=new HashMap<String,Object>();
     map4.put("name","自考本科");
     map4.put("value",bff);
     Map<String,Object> map5=new HashMap<String,Object>();
     map5.put("name","大专");
     map5.put("value",bfs);
     Map<String,Object> map6=new HashMap<String,Object>();
     map6.put("name","博士");
     map6.put("value",os);
     Map<String,Object> map7=new HashMap<String,Object>();
     map7.put("name","其他");
     map7.put("value",k);
     list.add(map);
     list.add(map2);
     list.add(map3);
     list.add(map4);
     list.add(map5);
     list.add(map6);
     list.add(map7);
     return list;
	}