05数据列

什么是数据列

数据列中使用数组包含多个或者多种数据。数据和plotOptions中图表类型一一对应

1. 数据列中name会显示到Legend图例以及Tooltip提示框中

series: [{
    name: '',
    data: []
}]

数据列中的数据

数据列中的data属性有以下三种方式定义。这一以基本图表（以x,y轴为坐标轴）为例

数值数组

1. data: [1,2,3,4,5]
2. 这种情况下，x值根据以下方式得到

• 根据x轴的配置，自动计算
• 从0自增
• 根据pointStart和pointInterval自增，它是属于series中的配置
• 在分类轴中，x值就是categoies配置

包含连个值的数组集合

1. data: [[1,2],[2,3]]
2. 第一个值代表x值。但是，如果是字符串，代表该点的名字。在这种情况下，x值会根据上述方式得到

数据点对象集合

data : [{
    name : "point 1",
    color : "#00ff00",
    y : 0
}, {
    name : "Point 2",
    color : "#ff00ff",
    y : 5
}] 

数据点及标记

数据点

1. 数据点在其它非直角坐标图中，数据点不仅标示x,y值，比如在饼图中，数据点只表示一个值

标记marker

1. series中每个数据列都有marker
2. data中每个数据点都有marker
3. 它的作用是在 直线图、曲线图、面积图及面积范围图中可以为数据点指定标记

数据列配置

数据列配置级别

1. 配置级别从低到高

• plotOptions.series，plotOptions本身就是数据列配置，其中的series意思是，针对所有类型图表有效
• plotOptions.{图表类型}，针对某一种图表有效
• series中，这对当前数据列有效

plotOptions: {
  spline: {           // 针对 spline 有效的配置
    lineWidth: 1 
  },
  series: {           // 针对所有数据列有效的配置
    lineWidth: 2
  }
}
series: [{
  id: 'series 1',
  type: 'spline',       // type 默认值是 'line'
  data: [1, 4, 56, 69],
  lineWidth: 2          // 该参数会覆盖 plotOptions.spline.lineWidth 里的配置
}, {
  data: [4, 5, 6],
  lineWidth: 3          // 该参数会覆盖 plotOptions.series.lineWidth 里的配置
}]

动画

1. 通过series.animation或者plotOptions.series.animation来执行动画的相关配置

颜色

1. 通过series.color指定数据列的颜色，通过plotOptions.{图表类型}.color指定某种类型的图表颜色

点的选择

1. allowPointSelect可以在配置三级中设置
2. 获取选中的点

var selectedPoints = chart.getSelectedPoints();

线条宽度

1. lineWidth设置线条宽度

鼠标形状

1. cursor属性可以指定鼠标的形状

数据标签

数据标签指的是在数据点上显示一些数据信息标签，不是提示标签，对应API为series.data.dataLabels。关于数据点的配置，在数据列上基本都能配置，因此，在series.dataLabels上也能配置

plotOptions: {
    line: {
        dataLabels: {
            enabled: true,
            formatter: function() {
                return this.x + "   " + this.y;
            }
        }
    }
}

1. 在formatter函数中，可用变量有：

• this.percentage 只在堆叠图或饼图中有效，是该点相对总值的百分比
• this.point 数据点对象，可以通过该对象来获取数据点相关的属性，例如 x 值，y值等
• this.series 数据点所在的数据列对象，可以通过该对象来获取数据列的属性，例如 this.series.name。
• this.total 只在堆叠图中有效，表示堆叠总值。
• this.x x 值
• this.y y 值

线条样式

这个选项位于series下

1. dashStyle

数据列分区

应用场景： 一条数据列上，不同范围的线段需要不同的样式和颜色等。zones可以解决这种现象，它是一个对象数组

• value，分区的最大值
• fillColor,填充颜色，只对面积数列起作用
• dashStyle,线条样式
• color,颜色
• className，类名

默认对应的是y轴，可以通过series.zoneAxis改变为x轴