如图,数据转化
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
const val=[{
"axis": "2021-07-25",
"name": "A",
"data": "12"
},
{
"axis": "2021-07-25",
"name": "B",
"data": "20"
},
{
"axis": "2021-07-26",
"name": "B",
"data": "5"
},
{
"axis": "2021-07-27",
"name": "A",
"data": "15"
},
{
"axis": "2021-07-27",
"name": "B",
"data": "30"
}
]
//数据
const series = [];
let xAxisList = [];
let yAxisList = [];
const legendName = [];
for (const i in val) {
xAxisList[i] = val[i].axis;
yAxisList[i] = val[i].name;
}
// console.log(yAxisList,)
// setUnique(arr) {
// let newArr = [];
// arr.forEach(item => {
// return newArr.includes(item) ? '' : newArr.push(item);
// });
// return newArr;
// },
// debugger
// xAxisList.forEach(item => {
// return xAxisList.includes(item) ? '' : xAxisList.push(item);
// });
// console.log( ...[new Set(xAxisList)],'90')
xAxisList = Array.from(new Set(xAxisList))
yAxisList = Array.from(new Set(yAxisList))
// console.log(xAxisList,'9090')
// yAxisList = this.setUnique(yAxisList);
for (const i in yAxisList) {
const data = new Array(xAxisList.length).fill(0);
for (const j in xAxisList) {
for (const k in val) {
if (val[k].name == yAxisList[i]) {
if (val[k].axis == xAxisList[j]) {
data[j] = val[k].data;
// console.log(data,'000')
// console.log(xAxisList,'11')
// console.log(yAxisList,'22')
}
}
}
}
series.push({
name: yAxisList[i],
type: "bar",
data: data})
console.log(series,'333')
console.log(val,'22')
}
// console.log(a)
</script>
</body>
</html>