javascript - 高图 : How to add multiple lines on the same x-axis

Question

我正在使用 highcharts 创建多轴图。我知道这没有意义，因为数据之间没有比较。但我仍然需要这样做。

所以现在我想要的是穿过条形的橙色线。我不希望它通过所有的酒吧。相反，我希望橙色线从上到下位于每个栏上。所以我希望这条橙色线只分别穿过 abc、qwe 和 xyz 的顶部，并在底部结束。所以基本上我想在同一个 x 轴上有多条线。我不希望同一条线穿过所有的酒吧。但每个都有自己的垂直线，仅从条形的顶部边缘开始，到条形的底部边缘结束。

我该怎么做。任何帮助将不胜感激。下面是我的代码。

Answer 1

您可以将虚线系列分成 3 个虚线系列。然后你可以使用 x 参数来设置你的线应该在的轴上的值。例如你可以设置

{
    name: 'Average',
    type: 'fakeLine',
    color: 'orange',
    dashStyle: 'shortdash',
    data: [{
      name: 'QWE',
      x: 0.84,
      y: 3000
    }, {
      name: 'QWE',
      x: 1.2,
      y: 3000
    }],
    stack: '',
    tooltip: {
      formatter: function() {
        return ' ' + this.point.name + ":" + this.point.y + '<br />'
      }
    },
  },

并且只有一行从中间栏的顶部到底部。

示例:https://jsfiddle.net/dto3Lt1f/3/