eacharts 饼图轮播循环

     wgEvent() {
          deptPerson().then((res) => {
            let data = res.data;
            let chart = echarts.init(this.$refs.faultTop5, "macarons");
            //随着屏幕大小调节图表
            window.addEventListener("resize", () => {
              this.deptname.resize();
            });
            let option = {
              tooltip: {
                trigger: "item",
                backgroundColor: "none",
                textStyle: {
                  fontSize: 12,
                  fontFamily: "Microsoft YaHei",
                },
              },
              color: [
                "#22c4ff",
                "#1ee7d4",
                "#ffb743",
                "#ff7943",
                "#ffe0ab",
                "#6bc5f4",
                "#c08ef2",
                "#ffda49",
              ],

              series: [
                {
                  type: "pie",

                  radius: ["45%", "70%"],
                  center: ["50%", "50%"],

                  label: {
                    show: false,
                    position: "center",
                    formatter: "{b_style|{b}}\n{c_style|{c}}",
                    rich: {
                      b_style: {
                        fontSize: 12,
                      },
                      c_style: {
                        color: "#fff",
                        fontSize: 18,
                        padding: [5, 0, 5, 0],
                      },
                    },
                  },
                  emphasis: {
                    label: {
                      show: true,
                      fontSize: "14",
                      fontWeight: "normal",
                    },
                  },
                  labelLine: {
                    show: false,
                  },

                  hoverOffset: 20,
                  startAngle: 90,
                  data: [
                    { value: 335, name: "异常登陆" },

                    { value: 234, name: "敏感查询" },
                    { value: 135, name: "违规操作" },
                    { value: 1548, name: "越权访问" },
                  ],
                },
              ],
            };

            this.deptname.setOption(option);

            //   var currentIndex = -1;
            //   setInterval(() => {
            //     var dataLen = option.series[0].data.length;
            //     // 取消之前高亮的图形
            //     this.deptname.dispatchAction({
            //       type: "downplay",
            //       seriesIndex: 0, //表示series中的第几个data数据循环展示
            //       dataIndex: currentIndex,
            //     });
            //     currentIndex = (currentIndex + 1) % dataLen; //+1表示每次跳转一个
            //     // 高亮当前图形
            //     this.deptname.dispatchAction({
            //       type: "highlight",
            //       seriesIndex: 0,
            //       dataIndex: currentIndex,
            //     });
            //     // 显示 tooltip
            //     this.deptname.dispatchAction({
            //       type: "showTip",
            //       seriesIndex: 0,
            //       dataIndex: currentIndex,
            //     });
            //   }, 2000);
            this.handleChartLoop(option, this.deptname);
          });
        },
        // 饼图自动轮播
        handleChartLoop(option, myChart) {
          if (!myChart) {
            return;
          }

          let currentIndex = -1; // 当前高亮图形在饼图数据中的下标
          //     // 显示 tooltip

          let changePieInterval = setInterval(selectPie, 1000); // 设置自动切换高亮图形的定时器

          // 取消所有高亮并高亮当前图形
          function highlightPie() {
            // 遍历饼图数据，取消所有图形的高亮效果
            for (var idx in option.series[0].data) {
              myChart.dispatchAction({
                type: "downplay",
                seriesIndex: 0,
                dataIndex: idx,
              });
            }
            //  myChart.dispatchAction({
            //     type: "showTip",
            //     seriesIndex: 0,
            //     dataIndex: idx,
            //   });
            // 高亮当前图形
            myChart.dispatchAction({
              type: "highlight",
              seriesIndex: 0,
              dataIndex: currentIndex,
            });
          }

          // 用户鼠标悬浮到某一图形时，停止自动切换并高亮鼠标悬浮的图形
          myChart.on("mouseover", (params) => {
            clearInterval(changePieInterval);
            currentIndex = params.dataIndex;
            highlightPie();
          });

          // 用户鼠标移出时，重新开始自动切换
          myChart.on("mouseout", (params) => {
            if (changePieInterval) {
              clearInterval(changePieInterval);
            }
            changePieInterval = setInterval(selectPie, 1000);
          });

          // 高亮效果切换到下一个图形
          function selectPie() {
            var dataLen = option.series[0].data.length;
            currentIndex = (currentIndex + 1) % dataLen;
            highlightPie();
          }
        },