ECharts3 实现动态数据累积图2+时间坐标
来源:互联网 发布:淘宝儿童保暖杯 编辑:程序博客网 时间:2024/06/04 18:35
对ECharts3官网中动态数据+时间坐标轴实例进行了修改,X轴为当前时间,并数据累积。
可在ECharts3实例中的代码框中粘贴直接查看效果。
function randomData() { now = new Date(+now + 1000); value = value + Math.random() * 21 - 10; return { name: now.toString(), value: [ now, Math.round(value) ] }}var data = [];var now = new Date();var value = Math.random() * 1000;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 } }, yAxis: { type: 'value', boundaryGap: [0, '100%'], splitLine: { show: false } }, series: [{ name: '模拟数据', type: 'line', showSymbol: false, hoverAnimation: false, data: data }]};setInterval(function () { //data.shift(); data.push(randomData()); myChart.setOption({ series: [{ data: data }] });}, 1000);
阅读全文
1 0
- ECharts3 实现动态数据累积图2+时间坐标
- ECharts3 实现数据动态更新3+时间坐标,数据累积
- ECharts3 实现动态数据累积图
- ECharts3 实现四象限图
- ECharts3 实现 AJAX异步加载 数据库数据
- Echarts3.0的简单使用,动态获取数据
- echarts3.0版本radar图tooltip实现显示单轴数据
- echarts3 柱状图实现
- Echarts3.0+JavaWeb+Mysql实现饼图,折线图,柱状图
- echarts3 饼图 柱形图 显示数据
- 【可视化】Echarts3图层
- Echarts3通过ajax动态获取数据,30秒定时图表数据,设置图表线条颜色和粗细
- 时间戳的累积误差
- js动态实现时间
- Echarts3.0+Ajax请求数据柱状图实例
- vuejs和echarts3整合(2)
- 累积流图 CFD
- 累积
- Android开发小技巧之商品属性筛选与商品筛选
- MySQL数据库的主从配置
- 20170921学MATLAB-GUI过程小结
- LeetCode编程练习
- Qt 模态和非模态窗口的创建与关闭
- ECharts3 实现动态数据累积图2+时间坐标
- Ajax的使用笔记
- 【caffe】Aborted at 1457505270 (unix time) try "date -d @1457505270" if you are using GNU date错误解决方法
- 9-21NOIp模拟赛总结
- 装饰器引伸之闭包
- HDU 5442 Favorite Donut (最大表示法+KMP || 后缀数组)
- 最长公共子串(动态规划)
- fragment嵌套使用
- data.table简介