在数据可视化世界里有一种图表专门用来回答一个问题“事情是按什么顺序发生的”很多数据不是简单的数值对比而是一连串事件。产品发布、项目里程碑、公司发展史、历史事件——这些数据天然带有时间维度。——这正是 Timeline Chart时间线图 的舞台。在 Highcharts 中Timeline 是一个专门用于展示**事件序列Event Sequence**的图表类型它将关键节点沿时间轴排列并通过视觉连接形成一条清晰的“事件轨迹”。一句话理解Timeline 时间轴 关键事件节点。它不是统计图而是一种数据叙事工具Data Storytelling。Highcharts Timeline chart 时间线图时间线图表可视化了重要事件在一段时间内的变化。带有时间线系列的图表会将每个数据点显示为沿水平或垂直线的单独事件。时间线系列也被称为时间线示意图。对于时间线系列中定义的每个点都会放置一个带有描述性文本的标记。建议将较长的事件描述放在工具提示中。这样在悬停在数据点上时描述信息就会显示出来。默认情况下工具提示会显示数据系列点的description属性所指定的文本。开始使用Highcharts Timeline chart 时间线图时间线系列需要同时加载 Highcharts 和 timeline.js 模块。以下是将时间线加载到网页的示例scriptsrchttps://code.highcharts.com/highcharts.js/scriptscriptsrchttps://code.highcharts.com/modules/timeline.js/script数据格式时间线图中的事件可以通过两种方式进行可视化将时间线划分为与系列数据中指定的数据点数量相等的时间段。将事件放置在与日期时间轴相关联的位置。这样就可以显示所有点之间的确切时间间隔。上述两种可视化时间线的方式其时间线系列数据的结构是不同的。Highcharts时间线图的系列数据包含时间段该系列数据没有设置x属性data:[{name:Some date,label:Event label,description:Description of this event.},{name:Another date,label:Another event label,description:Description of second event}]与日期时间轴相关联的事件要在日期时间轴上放置事件可以将 x 属性设置为自 1970 年以来的时间戳以毫秒为单位。系列数据示例data:[{x:1514764800000,name:Event name,label:Event label,description:Description of this event.},{x:1526774400000,name:Event name,label:Another event label,description:Description of second event}]下方的演示展示了太空探索的时间线。演示中显示了均匀的时间间隔下方的演示还展示了太空探索的关键时刻但它扩展了更多事件并在datetime轴上显示了实时日期。竖直方向的时间线若要显示垂直时间线将chart.inverted设置为true。交替显示标签在dataLabels配置中使用alternate属性以交替放置数据标签在点的两侧。其他配置选项自定义时间线图表提供大多数Highcharts图表的标准选项如数据标签的宽度、距离或使用点属性、颜色、x、标记或连接器。在下面的演示中数据点属性中的颜色属性用于设置时间线中某一部分的颜色。下方的演示展示了时间线系列图中不同元素的样式。