后端代码
@ResponseBody
@RequestMapping(value = "/test",produces = "application/json;charset=utf-8",method = RequestMethod.POST)
public String eEharts(){
PageData pd = new PageData();
List<PageData> list =null;
try {
list = userService.charts();
} catch (Exception e) {
e.printStackTrace();
}
//JSONArray.fromObject(list)或者//JSONObject.fromObject(list)把list集合 转换成json格式 把list集合 转换成json格式
return R.doOut(JSONArray.fromObject(list));
}
}
前端代码
</script>
<h3>异步加载图</h3>
<div id="main3" STYLE="width: 600px;height: 400px"></div>
<script>
var myChart = echarts.init(document.getElementById("main3"))
myChart.setOption ({
xAxis: {
type: 'category',
data: []
},
yAxis: {
type: 'value'
},
series: [{
data: [],
type: 'line'
}]
});
var n =[]; //定义两个数组
var s =[];
$.ajax({
url:'<%=basePath%>charts/test',
method:'POST',
data:'',
success:function(data){
var newData = JSON.stringify(data); //把前端传过来的数据转换为json字符串
var jsda = eval('('+newData+')'); // eval 检验json里的每一个字符串
for(var a in jsda){ //for循环遍历json里的数据
n.push(jsda[a].name); //把遍历的数据存到数组里
s.push(jsda[a].shuliang)
}
var option = {
xAxis: {
type: 'category',
data:n
},
yAxis: {
type: 'value'
},
series: [{
data: s,
type: 'line'
}]
};
myChart.setOption(option);
}
})
</script>