解决ajax获取到数据放到echarts无法显示的问题

   后台部分代码:

                returnMap.put("powerLevelCategories", powerLevelCategories);
    		returnMap.put("powerLevelSeries", powerLevelSeries);
		try
		{
			response.setContentType("text/text;charset=UTF-8");// 给发送到前端的数据
															   // 设置编码格式
															   // 这边适合非IE浏览器
			String jsonResult = JsonMapper.toJsonString(returnMap);
			PrintWriter out = response.getWriter();
			out.print(jsonResult);// 发送数据到前端
			out.flush();
			out.close();// 关闭流
		}
		catch (Exception e) 
		{
			e.printStackTrace();
		}
		return null;

由于ajax返回前端的数据为一个json字符串,而echart的data需要的是一个数组类型的数据,如果我们在后台将数据组成“['xxx','aaa','bbb']”传给前端echart,echart是无法展示的,所以我们需要在前端将数据拆分放入数组中再传给echart就可以展示了。

$.ajax({
			        type: "post",  
			        url:  "${ctx}/power/project/total/cityChart?city="+type,
			        async: false,  
			        success: function(data) 
			        { 
 			        	var dataStr = JSON.parse(data);
 			        	categoriesdata = [];
 			        	seriesdata = [];
						var strs1= new Array(); //定义一数组 
						var strs2= new Array(); //定义一数组 
						strs1 = dataStr.powerLevelCategories.toString().split(",");
						strs2 = dataStr.powerLevelSeries.toString().split(",");
						//将需要展示的数据放入数组中
						for(var i = 0; i < strs1.length; i++){
							categoriesdata.push(strs1[i]);
						}
						for(var i = 0; i < strs2.length; i++){
							seriesdata.push(parseInt(strs2[i]));
						}
			        }
				});

猜你喜欢

转载自blog.csdn.net/xufei4987/article/details/80845744
今日推荐