echarts图表 一个图表自动切换多组数据。

Question

使用定时器 但是我不知道代码怎么写了 请大家帮忙看看 指点一下
(function () {
// 基于准备好的dom，初始化echarts实例
var mychart = echarts.init(document.querySelector(".line .chart"));
//数据变化
var yearData = [

    {
        year: '2019',
        data: [
            // 两个数组有两条线
            [24, 40, 101, 134, 90, 230, 210, 120, 230, 210, 120, 222],
            [40, 64, 191, 124, 290, 330, 310, 123, 180, 200, 188, 79]
        ]
    },
    {   
        year: '2020',
        data: [
            [123, 175, 112, 197, 121, 67, 98, 21, 43, 64, 76, 38],
            [143, 131, 165, 123, 178, 21, 82, 64, 43, 68, 19, 34]
        ]
    }
];
// 指定配置和数据
var option = {
    color: ['#00f2f1', '#ed3f35'],
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        // 图例组件的颜色及位置
        textStyle: {
            color: '#4c9bfd',
        },
        // 距离右边10%
        right: '10%',
    },
    grid: {
        top: '20%',
        left: '3%',
        right: '4%',
        bottom: '3%',
        // 显示边框
        show: true,
        // 包含刻度文字在内
        containLabel: true
    },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
        // 去掉刻度
        axisTick: {
            show: false
        },
        // 去掉轴线
        axisLine: {
            show: false
        },
        // 文本颜色
        axisLabel: {
            color: '#4c9bfd'
        }
    },
    yAxis: {
        type: 'value',
        // 去掉刻度
        axisTick: {
            show: false
        },
        // 去掉轴线
        axisLine: {
            show: false
        },
        // 文本颜色
        axisLabel: {
            color: '#4c9bfd'
        },
        // 分割线颜色
        splitLine: {
            lineStyle: {
                color: "#012f4a"
            }
        }
    },
    series: [
        {
            name: '新增粉丝',
            type: 'line',
            // 数据堆叠
            // stack: '总量',
            // 折线图平滑
            smooth: false,
            data: yearData[0].data[0]
        },
        {
            name: '新增游客',
            type: 'line',
            // 数据堆叠
            // stack: '总量',
            smooth: false,
            data: yearData[0].data[1]
        }
    ]
};
// 把配置给实例对象
mychart.setOption(option);
//   图表跟随屏幕自适应
window.addEventListener("resize", function () {
    mychart.resize();
});

// 加载完页面，开启所有轮播定时器
window.onload = function () {
    clearInterval(tooltipInterval); // 清理提示框轮播定时器 
    clearInterval(lineInterval);   // 清理折线轮播定时器
    changeLine();    // 开启折线轮播定时器
    faultByHourTime();  // 开启提示框轮播定时器
}
function move() {
    var obj = yearData[$(this).index()];
    option.series[0].data = obj.data[0];
    option.series[1].data = obj.data[1];
}
// 需要重新渲染
mychart.setOption(option);

})();

Answer 1

mychart.setOption(option,true);