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

如上文所示,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. 如何使用Chrome Timeline 工具(译)

    [原文地址]https://developers.google.com/web/tools/chrome-devtools/profile/evaluate-performance/timeline- ...

  2. 数据挖掘之决策树ID3算法(C#实现)

    决策树是一种非常经典的分类器,它的作用原理有点类似于我们玩的猜谜游戏.比如猜一个动物: 问:这个动物是陆生动物吗? 答:是的. 问:这个动物有鳃吗? 答:没有. 这样的两个问题顺序就有些颠倒,因为一般 ...

  3. 在vue1.0遇到vuex和v-model的坑

    事情是这样的,在开发项目的过程中我使用了vuex并且在store中定义了一个保存用户信息的对象 userInfo : { 'nickName' : '', // 昵称 'password' :'', ...

  4. 动画--问题追踪:ImageView执行缩放动画ScaleAnimation之后,图像显示不全的问题。

    http://www.bkjia.com/Androidjc/929473.html: 问题追踪:ImageView执行缩放动画ScaleAnimation之后,图像显示不全的问题., 问题:我有一个 ...

  5. 使用compass编译sass

    1.初始化项目 compass create test(项目名称),会在当前目录下创建test子目录,test的子目录下有config.gb文件,sass和stylesheets文件夹. 2.编写sa ...

  6. android 自定义View Caused by: java.lang.ClassNotFoundException: Didn't find class

    在android studio中, 自定义View 时,出现 Caused by: java.lang.ClassNotFoundException: Didn't find class 在查看包名和 ...

  7. Android 常用控件的介绍

    http://www.cnblogs.com/linjiqin/category/284058.html 最流行的android组件大全:http://www.cnblogs.com/linjiqin ...

  8. 使用delphi+intraweb进行微信开发5—准备实现微信API,先从获取AccessToken开始

    在前4讲中我们已经使iw开发的应用成功和微信进行了对接,再接下来的章节中我们开始逐一尝试和实现微信的各个API,开始前先来点准备工作 首先需要明确的是,微信的API都是通过https调用实现的,分为p ...

  9. 64位电脑上配置mysql-connector-odbc的方法

    在系统盘搜索odbcad32,选择在C:\Windows\SysWOW64内的文件

  10. Java陷阱之assert关键字

    Java陷阱之assert关键字   一.概述   在C和C++语言中都有assert关键,表示断言. 在Java中,同样也有assert关键字,表示断言,用法和含义都差不多.   二.语法   在J ...