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]

]

}

Highcharts使用二维数组生成图表-LMLPHP

columns构建的二维数组

PS:该内容已经增加《网页图表Highcharts实践教程基础篇》v1.2.4中。

05-04 04:49