其他分享
首页 > 其他分享> > Echarts 循环实现动态加载series数据项

Echarts 循环实现动态加载series数据项

作者:互联网

取出需要在图表中配置的各项数据

	var count=0;//用于计算数据的变量
	var PRODUCE_TIME=[];//查询结果集合的出现的生产时间跨度集合
	var DEFECT_CNAME=[];//查询结果集合的出现的缺陷名称
	var list = resultGrid.eiInfo.extAttr[1];
//	var mapPojo = resultGrid.eiInfo.blocks.result.meta.metas;使用非block内的list 结构改变用不到了
	
	for(var i=0;i<list.length;i++){
		var time = list[i].PRODUCE_TIME.substr(0,timecount);//去除重复时间数据
		for(var j=0;j<PRODUCE_TIME.length;j++){
			if(time == PRODUCE_TIME[j]){time=null;break;}
			else{continue;}
		}
		if(time!=null){
			PRODUCE_TIME.push(time);
		}
		else{};
		
		
		var NAME = list[i].DEFECT_CNAME;//去除重复与空缺陷名称数据
		for(var j=0;j<DEFECT_CNAME.length;j++){
			if(NAME == DEFECT_CNAME[j]){NAME=null;break;}
			else{continue;}
		}
		if(NAME!=null){
			DEFECT_CNAME.push(list[i].DEFECT_CNAME);
		}
		else{};
	}

再设置存放数据的JSON

var json={};
	for(var j=0;j<DEFECT_CNAME.length;j++){//把缺陷名按顺序放入JSON中  为对应DEFECT_CNAME以便循环输出
		json[DEFECT_CNAME[j]]=new Array();//放入数组
		for (var i = 0; i < PRODUCE_TIME.length; i++) {
			json[DEFECT_CNAME[j]][i] = new Array();
			for (var x= 0; x < 3; x++) {
				if(x==0){
					json[DEFECT_CNAME[j]][i][x] = PRODUCE_TIME[i];
				}else{
					json[DEFECT_CNAME[j]][i][x] = 0;
				}
			}
		}
	}	

将数据按照逻辑放入JSON中:

	for(var i=0;i<list.length;i++){//遍历查询结果list集
		if(list[i].PRODUCE_TIME.substr(0,timecount)==PRODUCE_TIME[j]){//相同时间跨度的不同区域数据处理  缺陷个数和面积
			for(var X=0;X<DEFECT_CNAME.length;X++){
				if(DEFECT_CNAME[X]==list[i].DEFECT_CNAME){//同时间段同名数据
					count = json[DEFECT_CNAME[X]][j][1];
					count+=parseInt(list[i].DEFECT_COUNT);
					json[DEFECT_CNAME[X]][j][1]=count;
					
					
					count = json[DEFECT_CNAME[X]][j][2];
					count=Math.floor((parseFloat(list[i].DEFECT_AREA+count))*100)/100;
					json[DEFECT_CNAME[X]][j][2]=count;
					break;
				}
			}
		}
		else{
			j++;
			for(var X=0;X<DEFECT_CNAME.length;X++){
			if(DEFECT_CNAME[X]==list[i].DEFECT_CNAME){//同时间段同名数据
				count = json[DEFECT_CNAME[X]][j][1];
				count+=parseInt(list[i].DEFECT_COUNT);
				json[DEFECT_CNAME[X]][j][1]=count;
				
				count = json[DEFECT_CNAME[X]][j][2];
				count=Math.floor((parseFloat(list[i].DEFECT_AREA+count))*100)/100;
				json[DEFECT_CNAME[X]][j][2]=count;
				break;
			}
			}
		}
	}

将数据放入series:

var series=[];
	   for(var i = 0;i<DEFECT_CNAME.length;i++){
	       series.push({
	           name: DEFECT_CNAME[i],
	           type: 'line',
	           smooth: true,
	           data:json[DEFECT_CNAME[i]]
	       });
	 }

最后option中设置series,调用setOption展示图表

option = {
	......
	series: series,
	......
	}
	 ```

标签:数据项,count,series,list,DEFECT,json,CNAME,var,Echarts
来源: https://blog.csdn.net/Beatingworldline/article/details/113637305