如何使用 HighStock 在时间序列数据上绘制水平条/柱/线？

Question

我想在 highstock 的时间序列数据上绘制水平条 and/or 线，但是我无法识别相应的序列类型以及如何输入数据？

可能吗？如果是，如何？

我想象中的结果截图：

数据可能类似，例如：

[
  {
    "start": 1610969882000, // epoche time in ms
    "end": 1624016282000,
    "text": "Bar on timeseries",
    "style": "bar",
    "level": 1 // y-Axis height where to show
  },
  {
    "start": 1613648282000, 
    "end": 1618745882000,
    "text": "Line on timeseries",
    "style": "line",
    "level": 8
  }
]

我确实找到了 column-range charts which seem to work with line charts, however I struggled overlaying this on a highstock timeseries chart，在顶部添加了一个标签或使其成为带有工具提示的一行。添加到 highstock 总是以抛出错误“脚本错误”告终。

提前致谢，非常感谢您的专业知识！

Answer 1

使用xrange系列类型：

series: [{
    type: 'xrange',
    ...
}]

现场演示： https://jsfiddle.net/BlackLabel/o9ks1efd/

API参考：https://api.highcharts.com/highstock/series.xrange

如何使用 HighStock 在时间序列数据上绘制水平条/柱/线？

How to plot horizontal bars / columns / lines on timeseries data with HighStock?

charts

bar-chart

highcharts