highchart访问一次后台服务返回多张图表数据
本文承接上一篇,我们制作动态图表的时候,往往需要的不止一张图表,如果每张图表都与服务接口做一次交互的话未免太过频繁,这无论对前后还是后台都是一种压力,本文介绍一种一次访问返回多组数据的方式来减少前台与后台服务的交互,闲话少说,查看动态效果 →.→ 详细代码 ←.←
如上文所示,highchart 的 chart 属性可以添加 events 事件,上文中我们插入的事件为:
events: {
load: function () {
var series = this.series[0];
var old = 0;
setInterval(function () {
var x = (k++);
var y = Math.random() * 100;
while (y - old >= 10 || y - old <= -10) {
y = Math.random() * 100;
}
old = y;
series.addPoint([x, parseInt(y)], true, true);
}, 1000);
}
}
该事件为成功加载后每隔1秒钟获取一个随机数,若该数值与上一次产生的数值相差不超过10则将该数值添加到highchart数组中,否则重新生成随机数;但是该事件需要通过this.series[0] 来获取预定好的数组,如果我们需要多张图表的话,定义this.series[1],this.series[2].....产生的数据是放在一张图表里的,这与我们的需求不符。
当然我们也可以不写该events事件,而是直接将 setInterval(func,1000) 提到外面来写,如此便可实现 series 只定义一项,而分别应用到不同的图表中。
highchart访问一次后台服务返回多张图表数据的更多相关文章
- Oracle存储过程返回一张表数据
在oracle数据库中你要在程序里得到一张表的数据就必须先创建游标和SQL Service不一样. --创建游标create or replace package pkg_Dataas type re ...
- angular访问后台服务及监控会话超时的封装
angular访问后台服务及监控会话超时的封装 angular本身自带访问组件http和httpclient,组件本身都是异步模式访问.本文只列举了对http组件的封装同时也一同处理会话超时监控. 获 ...
- 利用广播调用后台服务方法并根据方法返回的内容更新UI
一.UI布局代码 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns ...
- Android Services (后台服务)
一.简介 服务是可以在后台执行长时间运行的应用程序组件,它不提供用户界面. 另一个应用程序组件可以启动一个服务,并且即使用户切换到另一个应用程序,它仍然在后台运行. 另外,组件可以绑定到一个服务来与它 ...
- Dubbo封装rest服务返回结果
由于Dubbo服务考虑到一个是给其他系统通过RPC调用,另外一个是提供HTTP协议本身系统的后台管理页面,因此Dubbo返回参数在rest返回的时候配置拦截器进行处理. 在拦截器中,对返回参数封装成如 ...
- vue学习过程总结(07) - vue的后台服务API封装及跨域问题的解决
以登录流程为例说明接口的封装. 1.登录调用后台的登录api 登录界面的代码 <template> <div class="login-page"> < ...
- Android 三级联动选择城市+后台服务加载数据库
技术渣,大家将就着看 首先我们需要一个xml数据保存到数据库,这里我从QQ下面找到一个loclist.xml文件 <CountryRegion Name="中国" Code= ...
- 应用AXIS开始Web服务之旅(soap web services)——使用三种不同的语言访问创建的Web服务,分别是JAVA、VB、VC
一. 介绍 本文并不是想介绍Web服务的原理.系统架构等,我们假设您已经了解了关于Web服务的一些基本的概念.原理等知识.本文主要是针对那些已经了解Web服务概念,但是还没有亲身体会Web服务所带来令 ...
- Android : App客户端与后台服务的AIDL通信以及后台服务的JNI接口实现
一.APP客户端进程与后台服务进程的AIDL通信 AIDL(Android Interface definition language-“接口定义语言”) 是 Android 提供的一种进程间通信 ( ...
随机推荐
- Spring 事务注解 错误问题
碰到个问题,在一个springmvc项目中,设置好事务,然后在service上添加@Transactional注解,只要一添加这个注解,该service就无法被spring创建成功, error cr ...
- unix&linux大学教程 目录
第1章unix简介 第2章什么是linux?什么是unix 第3章unix连接 第4章开始使用unix 第5章gui:图形用户界面 第6章unix工作环境 第7章unix键盘使用 第8章能够立即使用的 ...
- CORS 协议(跨域资源共享)
跨域问题 只要协议.域名.端口有任何一个不同,都被当作是不同的域. 为什么会有跨域的限制? 之前发生过的一些跨域安全事件: 新浪微博XSS受攻击事件 2011年6月28日晚,新浪微博出现了一次 ...
- DataGridView 导出到Excel
#region 导出四个表格到Excel /// <summary> /// 导出四个表格到Excel /// </summary> /// <param name=&q ...
- yum提示This system is not registered with RHN.RHN support will be disabled.
[root@cactiez ~]# yum install mlocateLoading "security" pluginLoading "rhnplugin" ...
- C++ 队列的实现
/************************************************************************/ /* 实现一个通用同步队列 使用链表实现队列 (先 ...
- php面向对象学习笔记
PHP 面向对象技术(全面讲解) Ø 主要内容 v 1.面向对象的概念 v 2.什么是类,什么是对象,类和对象之间的关系 v 3.什么是面向对象编程呢? v 4.如何抽象出一个类? v 5.如何实例化 ...
- 深入研究js构造函数和原型
很快就要从新浪离职了,最近心情比较轻松,抽点空整理一下构造函数和原型的机理. 我们都知道,在经典设计模式中我们最常用的就是工厂模式.构造函数模式.原型模式这几种,听起来‘模式’好像很高大上的样子,实际 ...
- R连接Mysql时,中文显示为问号的解决方案
1.打开Mysql安装目录下的my.ini文件,将其中的default-character-set= 均设置为GBK 2.在管理工具——数据源(ODBC)中将创建好的数据源作如下设置:
- Neo4j创建自动索引
一.创建Neo4j的Legacy indexing 1.为节点创建索引 官方API的创建示例为: 将一节点添加至索引: public static void AddNodeIndex(String n ...