Echarts在线免费图表

 
            // 随机数
function randomData() {
	now = new Date(+now + oneDay);
	value = value + Math.random() * 21 - 10;
	return {
		// 数据项名称
		name: '滚动数据',
		// x轴名称,值
		value:
			[[now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/'), Math.round(value)]
	};
}
let now = 89899 //new Date(1997, 9, 3);
let oneDay = 24 * 3600 * 1000;
let value = Math.random() * 1000;


console.log(5)
// 全部数据数组  数据格式[{name:数据项名称,value:[x轴名称,值]}]
let sumData = []
for (var i = 0; i < 1000; i++) {
	sumData.push(randomData());
}
// 一屏展示数据个数 
let showNum = 1000
// 展示数据数组
let showData = sumData.splice(0, showNum)

option = {
	tooltip: {
		trigger: 'axis',
		// formatter: function (params) {
		// },
		axisPointer: {
			animation: false
		}
	},
	xAxis: {
		type: 'time',
		splitLine: {
			show: false
		}
	},
	yAxis: {
		type: 'value',
		boundaryGap: [0, '100%'],
		splitLine: {
			show: false
		}
	},
	series: [
		{
			name: '滚动数据',
			type: 'line',
			showSymbol: false,
			areaStyle: {
				normal: {
					color: new echarts.graphic.LinearGradient(
						0,
						1,
						0,
						0,
						[
							{
								offset: 0,
								color: 'rgba(0,179,244,1)'
							},
							{
								offset: 1,
								color: 'rgba(0,179,244,0)'
							}
						],
						false
					)
				}
			},
			data: showData
		}
	]
};
// 滚动时间间隔设置 ms
let setTime = 1000
setInterval(function () {
	for (var i = 0; i < 5; i++) {
		showData.shift();
		showData.push(randomData());
	}
	myChart.setOption({
		series: [
			{
				data: showData
			}
		]
	});
}, setTime);