页面 定时器使用 实现echarts动效

vue+echarts 实现echarts动效
1.定义 定时器 工具类 loopShowTooltip

export function loopShowTooltip(myChart, option, num, time) {
  var defaultData = {
    // 设置默认值
    time: 1000,
    num: 12
  }
  if (!time) {
    time = defaultData.time
  }
  if (!num) {
    num = defaultData.num
  }
  var count = 0
  var timeTicket = null
  var clearLoop;
  timeTicket && clearInterval(timeTicket)
  timeTicket = setInterval(function () {
  	//定时逻辑
	myChart()
  }
  
  clearLoop = function(){
    timeTicket && clearInterval(timeTicket)
  }
  //返回 清除定时器的函数
  return clearLoop
}
export default {
  loopShowTooltip
}
 

2.页面引用工具类

// 引入插件
import { loopShowTooltip } from "@/utils/loopShowTooltip.js";
 
let tootipTimer;
// 可调用clearLoop方法，清除定时器
this.tootipTimer && this.tootipTimer();
this.tootipTimer = null;
this.tootipTimer = loopShowTooltip(data, option, 7, 1000);//data为要操作的数据  可以是echarts图例 （可以是逻辑函数 在工具函数里面进行调用）