后端传入数据不完整情况,例:两组时间节点,相同名称内,仅第一项时间节点有相关数据,第二项无数据,对此将数据进行整合补0,达到数据统一且能正常展示图表
示例data:
data: [
{
pestName: '花蝴蝶',
pestNum: 10,
title: '2023年03月30日'
},{
pestName: '粉蝴蝶',
pestNum: 15,
title: '2023年03月31日'
},{
pestName: '白蝴蝶',
pestNum: 14,
title: '2023年03月31日'
},{
pestName: '粉蝴蝶',
pestNum: 14,
title: '2023年03月30日'
},{
pestName: '粉蝴蝶',
pestNum: 15,
title: '2023年03月31日'
},
]
//调用方法,转换数据
const newData = this.objArrtransArrs(this.data);
const data = newData; // data 最终数据
//方法定义
// 图表参数名方法定义
objArrtransArrs(olddata) {
// 拿到数组的时间节点,去重
let title = []
olddata.forEach(item => {
title.push(item.title)
})
let titleArray = title.filter((item, index, array) => {
return array.indexOf(item) === index
})
var newArr = [];
// 数组遍历
for (var i = 0; i < olddata.length; i++) {
// 一个时间节点,数据缺失补零,保证图表拿到数据格式统一,正常展示
let datas = []
titleArray.forEach((item, index) => {
datas[index] = 0
})
var arrindex = newArr.findIndex((item, index, arr) => {return item.name === olddata[i].pestName}) //获取下标
if(arrindex==-1){ //不存在盘符数据的添加盘符数据
// 判断时间节点,获取下标,保证数据统一且正确存入标志位
var aaa = 1
titleArray.forEach((items, index) => {
if(olddata[i].title === items) {
aaa = index
}
})
datas[aaa] = olddata[i].pestNum
newArr.push({
"name": olddata[i].pestName,
"type": "line",
"stack": "Total",
"data": datas
});
} else { //有盘符则往盘符数据中添加
// 判断时间节点,获取下标,保证数据统一且正确存入标志位
var ccc = 1
titleArray.forEach((items, index) => {
if(olddata[i].title === items) {
ccc = index
}
})
newArr[arrindex].data[ccc]=olddata[i].pestNum
}
}
return newArr;
},
另附:参数名统一 格式
//调用方法,转换数据
const newData = this.objArrtransArr(this.data, "pestNum", "pestName");
const data = newData;
// 方法定义
objArrtransArr(olddata, oldval, oldname) {
const newArr = [];
olddata.forEach(item => {
// 定义数组内部对象形式
let obj = {};
obj.value = item[oldval];
obj.name = item[oldname];
// 将对象数据推到数组中
newArr.push(obj);
});
return newArr;
},