实时动态更新曲线图,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 ...
随机推荐
- java基础常识
现在总结一些经常接触到的java名词 一:java技术分类 javase:java standard editor:java标准版,主要定义java经常使用的API(Application Progr ...
- I2C总线协议的总结介绍
在看天翔哥的视频之后,他强调要把I2C协议好好研究一下,那么就对一些基本的通信手段是十分有帮助的..那么就来了解一下I2C总线协议的一些知识吧. I2C(Inter-Integrated Circui ...
- Java阻塞中断和LockSupport
在介绍之前,先抛几个问题. Thread.interrupt()方法和InterruptedException异常的关系?是由interrupt触发产生了InterruptedException异常? ...
- JDBC入门try/catch型
package com.itheima.domain; import java.sql.Connection; import java.sql.DriverManager; import java.s ...
- FusionChart 导出图片 功能实现(转载)
FusionChart 导出图片 功能实现(转载) http://www.cnblogs.com/jiagoushi/archive/2013/02/05/2893468.html 题目:精美Fusi ...
- 使用struts+spring+hibernate组装web应用
这篇文章将讨论怎样组合几个着名的框架去做到松耦合的目的,怎样建立你的构架,怎样让你的各个应用层保持一致.富于挑战的是:组合这些框架使得每一层都以一种松耦合的方式彼此沟通,而与底层的技术无关.这篇文章将 ...
- ### Paper about Event Detection
Paper about Event Detection. #@author: gr #@date: 2014-03-15 #@email: forgerui@gmail.com 看一些相关的论文. 1 ...
- Java线程间通信--生产者消费者
class ProducerConsumerDemo { public static void main(String[] args) { Resource r = new ...
- Java多线程的安全问题
/*多线程的安全问题1.为什么会出现安全问题?因为程序在运行时,会出现一个线程在判断条件满足后,具备了执行资格,但没有运行代码后一个线程也判断了条件,也具备了执行资格,后一个线程运行了代码,但这时候, ...
- 九度OJ 1348 数组中的逆序对 -- 归并排序
题目地址:http://ac.jobdu.com/problem.php?pid=1348 题目描述: 在数组中的两个数字,如果前面一个数字大于后面的数字,则这两个数字组成一个逆序对.输入一个数组,求 ...