数据处理-数据转换(图表)

61 阅读1分钟

如图,数据转化

Snipaste_2023-04-10_23-21-09.png

<!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>