Echarts的使用,异步加载数据及返回数据类型

1 篇文章 0 订阅

前台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;
	}

 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

qq_39098505

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值