后端传入数据不完整情况,例:两组时间节点,相同名称内,仅第一项时间节点有相关数据,第二项无数据,对此将数据进行整合补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; },
复制