动态数据+时间轴

gettimebox() {

var chartDom = document.getElementById('timebox');

var myChart = echarts.init(chartDom);

var option;

function randomData(val) {

now = new Date(+now + 60 * 1000);

value = value + Math.random() * 21 - 10;

var valueName = now.getFullYear() + '/' + (now.getMonth() + 1) + '/' + now.getDate() + ' ' + (now.getHours() >=

10 ? now.getHours() : '0' + now.getHours()) + ':' + (now.getMinutes() >= 10 ? now.getMinutes() : '0' + now

.getMinutes()); +

':' + (now.getSeconds() >= 10 ? now.getSeconds() : '0' + now.getSeconds())

return {

name: now.toString(),

value: [

valueName,

Math.round(value)

]

}

var data = [];

// 获取当前时间

var c_now = new Date();

if(c_now.getMinutes()<10){

var c_min = c_now.getMinutes() +50;

var c_hour = c_now.getHours()-1;

}

else{

var c_min = c_now.getMinutes() - 10;

var c_hour = c_now.getHours();

}

var c_day = c_now.getDate();

var c_month = c_now.getMonth() + 1;

var c_year = c_now.getFullYear();

// 给定某天的00：00

var now = +new Date(c_year + '-' + c_month + '-' + c_day + ' ' + c_hour + ':' + c_min + ':00');

var n_now = new Date(now);

var n_day = n_now.getDate();

var n_min = n_now.getMinutes() - 10;

var value = Math.random() * 1000;

if (n_day !== c_day) { //给定日期与当天日期不符

now = +new Date(c_year + '-' + c_month + '-' + c_day + ' ' + '00:00:00');

}

var num = Math.floor((+new Date() - now) / 60000) <= 1 ? 1 : Math.floor((+new Date() - now) / 60000);

for (var i = 0; i < num; i++) {

//初始化有多少个点

data.push(randomData());

}

option = {

title: {

text: '动态数据 + 时间坐标轴'

tooltip: {

trigger: 'axis',

formatter: function(params) {

params = params[0];

var date = new Date(params.name);

return date.getDate() + '/' + (date.getMonth() + 1) + '/' + date.getFullYear() + ' : ' + params.value[1];

axisPointer: {

animation: false

}

xAxis: {

type: 'time',

splitLine: {

show: false

axisLabel: { //坐标轴刻度标签的相关设置。

interval: 0,

rotate: "45"

yAxis: {

type: 'value',

boundaryGap: [0, '100%'],

splitLine: {

show: false

}

series: [{

name: '模拟数据',

type: 'line',

showSymbol: false,

hoverAnimation: false,

data: data

}]

};

var num = 0;

var that=this;

var timer = setInterval(function() {

// data.shift();

num++;

if (num == 4) {

that.gettimebox();

num=0;

clearTimeout(timer);

return false;

}

if ((new Date(now)).getDate() !== c_day) { //给定日期与当天日期不符,刷新页面从新的一天开始

window.history.go(0)

}

data.push(randomData());

myChart.setOption({

series: [{

data: data

}]

});

}, 60 * 1000);

option && myChart.setOption(option);

}