实时动态更新曲线图,x轴时间s随数据的变化而变化
$(function () {
$(document).ready(function () {
Highcharts.setOptions({
global: {
useUTC: false
}
});
$('#container').highcharts({
chart: {
type: 'spline',
animation: Highcharts.svg, // don't animate in old IE
marginRight: 10,
events: {
load: function () {
// set up the updating of the chart each second
var series = this.series[0];
setInterval(function () {
var x = (new Date()).getTime().getSecond, // current time
y = Math.random();
series.addPoint([x, y], true);
}, 1000);
}
}
},
title: {
text: 'Live random data'
},
xAxis: {
tickInterval:(new Date()).getTime().getSecond
},
yAxis: {
title: {
text: 'Value'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
formatter: function () {
return '<b>' + this.series.name + '</b><br/>' +
this.x + '<br/>' +
Highcharts.numberFormat(this.y, 2);
},
crosshairs:[true,true]//显示十指线
},
legend: {
enabled: false
},
exporting: {
enabled: false
},
series: [{
name: 'Random data',
data: (function () {
// generate an array of random data
var data = [],
time = (new Date()).getTime().getSecond,
i;
for (i = -19; i <= 0; i += 1) {
data.push({
x: time ,
y: Math.random()
});
}
return data;
}())
}]
});
});
});

实时动态更新曲线图,x轴时间s随数据的变化而变化的更多相关文章
- 5-Highcharts曲线图之轴反转
<!DOCTYPE> <html lang='en'> <head> <title>5-Highcharts曲线图之轴反转</title> ...
- SQL存在一个表而不在另一个表中的数据, 更新字段为随机时间
--更新字段为随机时间 86400秒=1天 UPDATE dl_robot ), ,GETDATE()) ) SQL存在一个表而不在另一个表中的数据 方法一 使用 not in ,容易理解,效 ...
- Mark Russinovich 的博客:Windows Azure 主机更新:原因、时间和方式
Mark Russinovich的技术博客涵盖 Windows故障排除.技术和安全等主题. Windows Azure主机更新:原因.时间和方式 Windows Azure的计算平台(其中包括 ...
- DataPipeline CTO 陈肃:我们花了3年时间,重新定义数据集成
目前,中国企业在大数据流通.交换.利用等方面仍处于起步阶段,但是企业应用数据集成市场却是庞大的.根据 Forrester 数据看来,2017 年全球数据应用集成市场纯软件规模是 320 亿美元,如果包 ...
- 实时更新Excel文档外部数据源的数据
实时更新Excel文档外部数据源的数据 单元格区域.Excel 表.数据透视表或数据透视图均可以连接到外部数据源(数据源:用于连接数据库的一组存储的"源"信息.数据源包含数据库服务 ...
- 【前端图表】echarts实现散点图x轴时间轴
话不多说,老规矩,先上图,实现echarts实现散点图,x轴数据为时间年月日. 实现代码如下: <!DOCTYPE html> <html> <head> < ...
- 定时器:为 Windows 实现一个连续更新,高精度的时间供应器
原著:Johan Nilsson 翻译:lxhui 原文出处:MSDN Magazine March 2004(Timers...) 原代码下载: HighResolutionTimer.exe (4 ...
- dedecmsV5.7织梦后台更新文章,发布时间不自动更新
问题:dedecmsV5.7后台修改文章的时候,会更新发布时间,需求是不自动更新时间,还是当时的发布时间 解决: 1.修改后台文件夹/templets/archives_edit.htm,articl ...
- Redis设置和更新Key的过期时间
EXPIRE key seconds 为给定 key 设置生存时间,当 key 过期时(生存时间为 0 ),它会被自动删除. 在 Redis 中,带有生存时间的 key 被称为『易失的』(volati ...
随机推荐
- LVS配置与安装
IP和主机准备: 准备VIP :20.20.20.1 lvs主机 :172.24.22.70 HA主机:172.24.22.4 包准备:ipvsadm-1.24.tar.gz 1.安装前配置包 2. ...
- 命令行界面下的用户和组管理之usermod的使用
当使用useradd添加好用户之后,想要做一些修改,这时需要用到usermod命令. 功能说明:修改用户帐号的各项信息. 语 法:usermod [-L | U][-c <备注>][-d ...
- 关于Eclipse Modeling Framework进行建模,第二部分
使用 Eclipse Modeling Framework 进行建模,第 2 部分 Eclipse 的 Java Emitter Templates(JET) 是一个开放源代码工具,可以在 Eclip ...
- 关于JFace中的向导式对话框(WizardDialog类)
向导式对话框是一种非常友好的界面,它能够引导用户一步步的输入信息.Eclipse的"新建项目",就是这样的向导式对话框. 在Eclipse中向导式对话框的开发是很简单的,它由Wiz ...
- [记录] javascript 对象中使用setTimeout
参考:Javascript对象中关于setTimeout和setInterval的this介绍 使用最后一个方法终于弄好了,简直了,在对象中使用setTimeout原来是这样的 做的是分钟倒计时,倒数 ...
- openvswitch安装和使用 --修订通用教程的一些错误
1.下载openvswitch源文件,注意版本要适合操作系统内核. 推荐openvswitch2.0及其以上版本. 2.开始安装openvswitch cd openvswitch sudo ./bo ...
- ios7之后 根据UILabel的文字计算frame的方法
ios7 新出来的根据label的文字和字体大小来确定label的宽高. 官方的方法是: - (CGRect)boundingRectWithSize:(CGSize)size options:(NS ...
- Java实战之02Hibernate-03Session中的常用方法
九.Session中的常用方法 1.save方法 都是临时态————>持久态 2.persist方法 作用: 持久化临时态对象. 与save方法的区别: 开始了事务:persist和save没有 ...
- Linux中的简单命令
history:打印你输过的命令 1.用户在shell中输入的命令会自动保存到内存缓冲区 2.在退出shell的时候,内存中的数据会刷新到磁盘文件:~/.bash_history ...
- 【HeadFirst设计模式】7.适配器模式与外观模式
今晚学习完第七章,顺便做一下知识备忘. 适配器模模式: 定义:将一个类的接口,转换成客户期望的另一个接口.适配器让原本接口不兼容的类可以合作无间. 对象适配器: 类适配器: 外观模式: 提供了一个统一 ...