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. Spring Cloud配置文件加载优先级简述

    Spring Cloud中配置文件的加载机制与其它的Spring Boot应用存在不一样的地方:如它引入了bootstrap.properties的配置文件,同时也支持从配置中心中加载配置文件等:本文 ...

  2. 【IDEA】IDEA下maven项目无法提示和使用EL表达式的解决办法

    今天在IDEA创建web项目之后发现无法使用EL和JSTL, 一.如果JSP中无法自动提示EL表达式,比如${pageContext.request.contextPath},可在pom.xml的&l ...

  3. linux0.11内核源码剖析:第一篇 内存管理、memory.c【转】

    转自:http://www.cnblogs.com/v-July-v/archive/2011/01/06/1983695.html linux0.11内核源码剖析第一篇:memory.c July  ...

  4. Video for Linux Two API Specification revision0.24【转】

    转自:http://blog.csdn.net/jmq_0000/article/details/7536805#t136 Video for Linux Two API Specification ...

  5. python笔记-冒泡排序【转载】

    本篇转自博客:上海-悠悠 原文地址:http://www.cnblogs.com/yoyoketang/tag/python/ 前言 面试的时候经常有面试官喜欢问如何进行冒泡排序?这个问题相信能难倒一 ...

  6. python爬虫beautifulsoup4系列2【转载】

    本篇转自博客:上海-悠悠 原文地址:http://www.cnblogs.com/yoyoketang/tag/beautifulsoup4/ 前言 本篇详细介绍beautifulsoup4的功能,从 ...

  7. ESXI和vSphere的安装配置-实现一台电脑硬件虚拟化为两台

    本篇文章包含以下几个部分: 1EXSI软件和vSphere软件的安装 2在vSphere上安装虚拟系统 3对虚拟系统通过配置实现硬件虚拟化,实现硬件直通 1.EXSI安装 通过网上下载EXSI ISO ...

  8. Python与数据结构[0] -> 链表/LinkedList[1] -> 双链表与循环双链表的 Python 实现

    双链表 / Doubly Linked List 目录 双链表 循环双链表 1 双链表 双链表和单链表的不同之处在于,双链表需要多增加一个域(C语言),即在Python中需要多增加一个属性,用于存储指 ...

  9. 测试工具APPScan安装与使用教程

  10. Tarjan缩点【p1726】上白泽慧音

    Description 在幻想乡,上白泽慧音是以知识渊博闻名的老师.春雪异变导致人间之里的很多道路都被大雪堵塞,使有的学生不能顺利地到达慧音所在的村庄.因此慧音决定换一个能够聚集最多人数的村庄作为新的 ...