Highcharts使用二维数组生成图表
二维数组是更为灵活的一种数据存储方式。在Highcharts中。能够使用配置项column和rows二维数组。对于使用columns构建的二维数组,Highcharts会依照列从上向下读取每一个x值的节点y值。而从第二行開始,每行是一个数据列,而且開始的第一个元素是数据列名。其构成的二维数组结构例如以下:
[
[null, x值1, x值2, x值3, …, x值n],
[数据列名1, y值1, y值2, y值3, …, y值n],
[数据列名2, y值1, y值2, y值3, …, y值n,],
[…… ],
[数据列n, y值1, y值2, y值3, …, y值n,]
]
对于使用rows构建的二维数组,Highcharts会依照从左到右读取每一个x值的节点y值。
而从第二列開始,每列都是一个数据列,而且開始的第一个元素是数据列名。其构成的二维数组结构例如以下:
[
[null, 数据列名1, 数据列名2, 数据列名3, …, 数据列名n],
[x值1, y值1, y值1, y值1, …, y值1 ],
[x值2, y值2, y值2, y值2, …, y值2 ],
[… ],
[x值n, y值n, y值n, y值n, …, y值n ],
]
以下从columns构建的二维数组中读取数据。生成图表。核心代码例如以下:
data: {
columns: [
[null, 1, 2, 3, 4, 5, 6, 7],
[‘成绩’,85,93,95,91,97,94,89]
]
}
columns构建的二维数组
PS:该内容已经增加《网页图表Highcharts实践教程基础篇》v1.2.4中。
Highcharts使用二维数组生成图表的更多相关文章
- JS实现将二维数组生成到页面上
前言 之前没说过数组,现在来写一下数组 CSS span { border:2px solid skyblue; width:30px; height: 30px; display: inline-b ...
- thinkphp foreach循环生成二维数组的方法
先做个问题记录,另外下面是做的过程中遇到的一个没想明白的现象 foreach($result as $key => $val ){ $wzList[$key]['lik']=$val[0]; $ ...
- C语言动态生成二维数组
# 动态创建二维数组示例 #include "stdlib.h" #include "stdio.h" #include <malloc.h> in ...
- 将String类型的二维数组中的元素用FileOutputStream的write方法生成一个文件
将String类型的二维数组中的元素用FileOutputStream的write方法生成一个文件import java.io.File;import java.io.FileOutputStre ...
- php数组根据某一个键值,把相同键值的合并生成一个新的二维数组
http://blog.csdn.net/xyzchenxiaolin/article/details/51700485 源数据: $infos = array( array( 'a' => 3 ...
- php数组实现根据某个键值将相同键值合并生成新二维数组的方法
$infos = array( array( 'a' => 36, 'b' => 'xa', 'c' => '2015-08-28 00:00:00', 'd' => '201 ...
- JAVA生成一个二维数组,使中间元素不与相邻的9个元素相等,并限制每一个元素的个数
JAVA生成一个二维数组,使中间元素不与相邻的9个元素相等,并限制每一个元素的个数 示例如下 至少需要九个元素:"A","B","C",&q ...
- 使用POI对excel进行操作生成二维数组
import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundException; import ja ...
- axis2生成webservice服务端返回String[]和String[][]一维数组和二维数组解析
环境:用axis2生成服务端,用aixs做客户端 1:直接返回String[]: public String[] testArr(String name) { String[] ret=new Str ...
随机推荐
- HDU5037 Frog
Once upon a time, there is a little frog called Matt. One day, he came to a river. The river could b ...
- 自以为是而已,不知道它是什么 window.onload 放执行
var $=jQuery=function(onload){window.onload=onload();} jQuery(function(){alert(2);}); $(function(){a ...
- IaaS, PaaS和SaaS
原文链接:http://www.leiphone.com/news/201406/iaas-paas-and-saas.html 云服务”现在已经快成了一个家喻户晓的词了.如果你不知道PaaS, Ia ...
- 培训补坑(day4:网络流建模与二分图匹配)
补坑时间到QAQ 好吧今天讲的是网络流建模与二分图匹配... day3的网络流建模好像说的差不多了.(囧) 那就接着补点吧.. 既然昨天讲了建图思想,那今天就讲讲网络流最重要的技巧:拆点. 拆点,顾名 ...
- glEnable(GL_DEPTH_TEST)的问题
http://www.gameres.com/msg_195903.html 在程序中加入glEnable(GL_DEPTH_TEST)之后显示就完全黑屏了,即使是清空了深度缓冲glClear(GL_ ...
- js面试总结
<div id="app"> <button onClick="app()">点击1</button> <button ...
- POJ 2689.Prime Distance-区间筛素数
最近改自己的错误代码改到要上天,心累. 这是迄今为止写的最心累的博客. Prime Distance Time Limit: 1000MS Memory Limit: 65536K Total S ...
- 二分LIS模板
假设存在一个序列d[1..9] = 2 1 5 3 6 4 8 9 7,可以看出来它的LIS长度为5. 下面一步一步试着找出它. 我们定义一个序列B,然后令 i = 1 to 9 逐个考察这个序列. ...
- HDU 6396 Swordsman --------2018 Multi-University Training Contest 7 (模拟+读入挂)
原题地址: 打怪升级 一开始有N个怪物:主角有K个能力:只有K个能力都击败怪物才能斩杀怪物并获得K个能力的增值:问最多能杀几个怪物: 做法: 用优先队列把怪物能力装进去:能力小放前面: 最重要的是数据 ...
- poj2763(树链剖分 - 边权)
poj2763 题意 给定一个树形图,某人原来在 s 点,每条边(路)有通过的时间花费,有两种操作:1. 查询某人到 u 点花费的时间 2. 更新某条路的时间花费. 分析 权值在边上,可以把它们 &q ...