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使用二维数组生成图表的更多相关文章

  1. JS实现将二维数组生成到页面上

    前言 之前没说过数组,现在来写一下数组 CSS span { border:2px solid skyblue; width:30px; height: 30px; display: inline-b ...

  2. thinkphp foreach循环生成二维数组的方法

    先做个问题记录,另外下面是做的过程中遇到的一个没想明白的现象 foreach($result as $key => $val ){ $wzList[$key]['lik']=$val[0]; $ ...

  3. C语言动态生成二维数组

    # 动态创建二维数组示例 #include "stdlib.h" #include "stdio.h" #include <malloc.h> in ...

  4. 将String类型的二维数组中的元素用FileOutputStream的write方法生成一个文件

      将String类型的二维数组中的元素用FileOutputStream的write方法生成一个文件import java.io.File;import java.io.FileOutputStre ...

  5. php数组根据某一个键值,把相同键值的合并生成一个新的二维数组

    http://blog.csdn.net/xyzchenxiaolin/article/details/51700485 源数据: $infos = array( array( 'a' => 3 ...

  6. php数组实现根据某个键值将相同键值合并生成新二维数组的方法

    $infos = array( array( 'a' => 36, 'b' => 'xa', 'c' => '2015-08-28 00:00:00', 'd' => '201 ...

  7. JAVA生成一个二维数组,使中间元素不与相邻的9个元素相等,并限制每一个元素的个数

    JAVA生成一个二维数组,使中间元素不与相邻的9个元素相等,并限制每一个元素的个数 示例如下 至少需要九个元素:"A","B","C",&q ...

  8. 使用POI对excel进行操作生成二维数组

    import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundException; import ja ...

  9. axis2生成webservice服务端返回String[]和String[][]一维数组和二维数组解析

    环境:用axis2生成服务端,用aixs做客户端 1:直接返回String[]: public String[] testArr(String name) { String[] ret=new Str ...

随机推荐

  1. CSS 清除浮动的4种方法

    此为未清除浮动源代码,运行代码无法查看到父级元素浅黄色背景.<style type=”text/css”> <!– *{margin:0;padding:0;} body{font: ...

  2. [转载]EasyUI中数据表格DataGrid添加排序功能

    我们这里演示的是EasyUI数据表格DataGrid从服务器端排序功能,因为觉的本地数据排序没有多大的作用,一般我们DataGrid不会读取全部数据,只会读取当前页的数据,所以本地数据排序也只是对当前 ...

  3. mysql 事务、游标

    mysql 事务 在MySQL中只有使用了Innodb数据库引擎的数据库或表才支持事务,所以很多情况下我们都使用innodb引擎. 事务处理可以用来维护数据库的完整性,保证成批的SQL语句要么全部执行 ...

  4. PhpStorm 快捷键大全 PhpStorm 常用快捷键和配置+如何关闭快捷键ctrl+alt+方向键旋转屏幕

    如果映射的是eclipse的快捷键,又同时安装了英特尔的GPU软件,那么会有这个快捷键冲突 就是快速复制快捷键:ctrl+alt+方向键  会调用英特尔旋转屏幕,禁用掉即可 PhPStorm 是 Je ...

  5. Nginx虚拟主机(Virtual Host)配置

    虚拟主机(Virtual Host)可以在一台服务器上绑定多个域名,架设多个不同的网站,一般在开发机或者要部署多个小网站的服务器上需要配置虚拟主机.nginx的虚拟主机配置其实也挺简单,为了使得配置文 ...

  6. NYOJ 21.三个水杯-初始态到目标态的最少次数-经典BFS

    题目传送门:biubiubiu~ 三个水杯 时间限制:1000 ms  |  内存限制:65535 KB 难度:4   描述 给出三个水杯,大小不一,并且只有最大的水杯的水是装满的,其余两个为空杯子. ...

  7. springboot引入thymeleaf

    springboot引入thymeleaf 1.Thymeleaf使用 @ConfigurationProperties(prefix = "spring.thymeleaf") ...

  8. springMVC笔记:jsp页面获取后台数据记录列表

    1.读取数据库中的记录List<HashMap<String,String>> attributes; 2.Controller构造Model如下: @RequestMappi ...

  9. IE浏览器Cookie信息提取工具Galleta

    IE浏览器Cookie信息提取工具Galleta   浏览器Cookie中保存着用户访问网站的各项敏感信息,如用户登录凭证.提取这些信息后,就可以以该用户的身份访问对应的网站.为了方便信息获取,Kal ...

  10. 集合框架(中):Map

    Map接口: Map提供了一种映射关系,其中的元素就是以键值对(key-value)的形式存储的,能够实现根据key快速查找value Map中的键值对以Entry类型的对象实例形式存在 键(key值 ...