echats中的数据循环
echarts中的xAxis中的data和series中的data都是数组格式、都是数组格式、都是数组格式(重要事情说三遍),只有知道需要什么类型的数据才能数据异步加载中创建出与之对应的数据。
第一步、第二步没有什么不同,下面以柱状图的数据循环为例
第一步初始化
var myChart = echarts.init(document.getElementById(Chartid));
第二步、设置标题、图例、空的坐标
myChart.setOption({
title:{
text:title
},
tooltip: {},
legend:{
orient:'vertical',
x:'right',
data:['版本A','版本B']
},
xAxis:{
data:[]
},
yAxis: {},
series:[
{
name:'版本A',
type:'bar',
data:[]
},
{
name:'版本B',
type:'bar',
data:[]
}]
});
第三步、数据异步加载,数据循环
$.get(url).done(function(data){
var obj = JSON.parse(data);
var sxAxis=[];
var aseries=[];
var bseries=[];
//坐标和数据都push到数组中
for(var i=0;i<obj.length;i++){
sxAxis.push(
obj[i].option//
);
aseries.push(
obj[i].edita
);
bseries.push(
obj[i].editb
);
}
myChart.setOption({
xAxis:{
type : 'category',
data:sxAxis//使用数组
},
series:[{
name:'版本A',
data:aseries //使用数组
},
{
name:'版本B',
data:bseries //使用数组
}]
});
});