ECharts3 实现数据动态更新3+时间坐标,数据累积

来源:互联网 发布:微老板软件 编辑:程序博客网 时间:2024/06/05 10:55

代码修改自ECharts3文档异步数据加载和更新中的数据的动态更新部分,原示例固定显示若干数据,简单进行了修改,数据累积加上时间坐标。
是否累积数据的关键在于shift(),去掉shift()之后即累积数据。

其实ECharts3之后更新数据挺简单的,越来越清晰。
这里写图片描述

var date = [];var data = [Math.random() * 150];var now = new Date();function addData() {    ss=now.getTime() % 60000    seconds=ss = (ss - (ss % 1000)) / 1000    now = [now.getHours(),now.getMinutes(),seconds].join(':');    date.push(now);    data.push((Math.random() - 0.4) * 10 + data[data.length - 1]);    now = new Date();}option = {    xAxis: {        type: 'category',        boundaryGap: false,        data: date    },    yAxis: {        boundaryGap: [0, '20%'],        type: 'value'    },    series: [        {            name:'成交',            type:'line',            smooth:true,            symbol: 'none',            stack: 'a',            areaStyle: {                normal: {}            },            data: data        }    ]};setInterval(function () {    addData(true);    myChart.setOption({        xAxis: {            data: date        },        series: [{            name:'成交',            data: data        }]    });}, 1000);
原创粉丝点击