Highcharts数据表示(2)

Highcharts数据表示(2)

数据节点是图表中最小的元素。每一个数据节点都是一个数据单元。

它确定了图表中一个图形元素的各种信息。一个数据节点通常包含下面三类信息：

1.坐标位置信息

因为Highcharts中大部分的图表都是平面2D类型的，所以每一个节点都须要相应的坐标信息(x,y)。在Highcarts中，坐标信息是通过配置项x和y定义的。

其语法形式例如以下：

• x:Number|String
• y:Number

当中，配置项x的值能够为数字，也能够是字符串。配置项y必须是数字。

2.其它必须信息

除了坐标信息外，非常多图表须要节点提供额外的信息，如柱体的颜色，气泡的大小等等。

对于这些信息，也是在数据节点中定义的。比如对于柱形图的节点，须要使用配置项color指定该节点相应的柱体的颜色，语法例如以下：

• color:Color

当中，參数Color指定该柱体填充的颜色。

3.用户补充信息

有时，用户为了对节点信息做补充。

这时。用户须要创建自己的配置项。并赋值。

这些节点信息能够在提示框、数据标签中显示。比如，在本书第一个实例中。用户能够为每一个节点加入配置项，存放最高温度发生的时间。形式例如以下：

• hightemtime:Number|String|Object

当中，配置项名hightemtime是用户自定义的，其值的类型也是用户自己指定的。

我们了解节点中包括的信息后，就能够将全部的信息定义为。其形式例如以下：

• {
• x:Number|String,
• y:Number,
• color:Color,
• hightemtime:Number|String|Object
• }

每一个节点都是这种一个对象。而整个数据列的节点就构成一个对象数组，形式例如以下：

• data:[{
• x:Number|String,
• y:Number,
• color:Color,
• hightemtime:Number|String|Object
• },{
• x:Number|String,
• y:Number,
• color:Color,
• hightemtime:Number|String|Object
• },
• ……
• {
• x:Number|String,
• y:Number,
• color:Color,
• hightemtime:Number|String|Object
• }]

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