Highcharts使用二维数组生成图表

时间：2015-07-20 16:41:09 阅读：202 评论：0 收藏：0 [点我收藏+]

二维数组是更为灵活的一种数据存储方式。在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使用二维数组生成图表

标签：highchart 使用二维数组生成图表

原文地址：http://blog.csdn.net/jsbome/article/details/46967981

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行