Highcharts:如何在同一个x轴上添加多行

时间:2015-12-22 10:49:31

标签: javascript jquery css

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

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

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

1 个答案:

答案 0 :(得分:3)

您可以将虚线系列划分为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/