本文承接上一篇,我们制作动态图表的时候,往往需要的不止一张图表,如果每张图表都与服务接口做一次交互的话未免太过频繁,这无论对前后还是后台都是一种压力,本文介绍一种一次访问返回多组数据的方式来减少前台与后台服务的交互,闲话少说,查看动态效果  →.→ 详细代码 ←.←

如上文所示,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访问一次后台服务返回多张图表数据的更多相关文章

  1. Oracle存储过程返回一张表数据

    在oracle数据库中你要在程序里得到一张表的数据就必须先创建游标和SQL Service不一样. --创建游标create or replace package pkg_Dataas type re ...

  2. angular访问后台服务及监控会话超时的封装

    angular访问后台服务及监控会话超时的封装 angular本身自带访问组件http和httpclient,组件本身都是异步模式访问.本文只列举了对http组件的封装同时也一同处理会话超时监控. 获 ...

  3. 利用广播调用后台服务方法并根据方法返回的内容更新UI

    一.UI布局代码 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns ...

  4. Android Services (后台服务)

    一.简介 服务是可以在后台执行长时间运行的应用程序组件,它不提供用户界面. 另一个应用程序组件可以启动一个服务,并且即使用户切换到另一个应用程序,它仍然在后台运行. 另外,组件可以绑定到一个服务来与它 ...

  5. Dubbo封装rest服务返回结果

    由于Dubbo服务考虑到一个是给其他系统通过RPC调用,另外一个是提供HTTP协议本身系统的后台管理页面,因此Dubbo返回参数在rest返回的时候配置拦截器进行处理. 在拦截器中,对返回参数封装成如 ...

  6. vue学习过程总结(07) - vue的后台服务API封装及跨域问题的解决

    以登录流程为例说明接口的封装. 1.登录调用后台的登录api 登录界面的代码 <template> <div class="login-page"> < ...

  7. Android 三级联动选择城市+后台服务加载数据库

    技术渣,大家将就着看 首先我们需要一个xml数据保存到数据库,这里我从QQ下面找到一个loclist.xml文件 <CountryRegion Name="中国" Code= ...

  8. 应用AXIS开始Web服务之旅(soap web services)——使用三种不同的语言访问创建的Web服务,分别是JAVA、VB、VC

    一. 介绍 本文并不是想介绍Web服务的原理.系统架构等,我们假设您已经了解了关于Web服务的一些基本的概念.原理等知识.本文主要是针对那些已经了解Web服务概念,但是还没有亲身体会Web服务所带来令 ...

  9. Android : App客户端与后台服务的AIDL通信以及后台服务的JNI接口实现

    一.APP客户端进程与后台服务进程的AIDL通信 AIDL(Android Interface definition language-“接口定义语言”) 是 Android 提供的一种进程间通信 ( ...

随机推荐

  1. Xposed Module开发教程1

    看了一下文档,发现Xposed这货实在太强大了,它直接对Zygote做了一些手脚,简直是无所不能.缺点就是需要安装一下框架.基本原理就是把Android 系统的app_process给替换了,然后启动 ...

  2. OAF_开发系列10_实现OAF动态LOV设定

    20150712 Created By BaoXinjian

  3. 双系统先装Windows,后装linux的原因

    由于windows在安装时,boot loader会预设装在MBR及分割槽的boot sector中,而且并不提供开机选单:而linux在安装时安装程序可以选择是安装在MBR中还是boot secto ...

  4. 通过seekBar改变图片的透明度

    作者:堕落的天使 对应的图片 activity_main.xml(代码) <RelativeLayout xmlns:android="http://schemas.android.c ...

  5. 帝国cms 无法生成静态页

    建立目录不成功!请检查目录权限 安装完了帝国网站管理系统(帝国CMS)之后,没有进行初始化内置数据的步骤,而引起的错误.其实只要你按照安装说明一步一步下来就不会出错. 解决办法:初始化内置数据 帝国c ...

  6. JNI中C调用Java方法

    背景需求 我们需要在JNI的C代码调用Java代码.实现原理:使用JNI提供的反射借口来反射得到Java方法,进行调用. JNI关键方法讲解. 1. 在同一个类中,调用其他方法 JNIEXPORT v ...

  7. C#预编译

    在C#开发中经常会遇到在Debug和Release模式下需要执行不同代码的情况,这个时候使用C#条件编译可以很好地解决这个问题,如 #if DEBUG // TO Do Debug Mode Code ...

  8. js执行跨域请求

    //js执行跨域请求 var _script = document.createElement('script'); _script.type = "text/javascript" ...

  9. Codeforces Round #232 (Div. 2) D. On Sum of Fractions

    D. On Sum of Fractions Let's assume that v(n) is the largest prime number, that does not exceed n; u ...

  10. 一起学习KenDo Mobile之一 建立一个简单的移动APP

    开发KenDo Mobile的开发工具只要求支持文本编辑即可,当然我自己用VS2013,大材小用. 移动应用程序开发不同于桌面应用程序开发,前者需要在移动设备上部署,后者使用台式电脑测试和调试应用程序 ...