javascript - 列范围图表 Highcharts 中的多个间隔

Question

我正在尝试创建一个包含多个类别的列范围图表，显示一年中的时间间隔。一切正常，但是，我现在遇到了一个问题，即对于其中一个类别，我需要在同一行上有两个间隔。

因此，例如，在下面附上的 fiddle 中，我将每个类别作为从月到月。

例如:

类别 1:三月至六月

类别 2:7 月->8 月

等等

但现在我坚持使用这个:

第三类:三月->六月，九月->十月

这是 fiddle : http://jsfiddle.net/t9rsf6n7/1/

series: [
                {
                    name: '',
                    color: '#795548',
                    data: [
                        {
            low:Date.UTC(2017,1,1),
            high:Date.UTC(2017,3,31),
            color:'#ffae3d'
          },
          {
            low:Date.UTC(2017,2,1),
            high:Date.UTC(2017,4,30),
            color:'#ff3d3d'
          }                     ]
                }
            ]

非常感谢任何帮助。

Answer 1

为每个数据点设置 x 值，对于类别 3 中的 2 个点，它们将具有相同的 x 值。

    series: [
    {
        name: '',
        color: '#795548',
        data: [
          {
            x:0,
            low:Date.UTC(2017,1,1),
            high:Date.UTC(2017,3,31),
            color:'#ffae3d'
          },
          {
            x:1,
            low:Date.UTC(2017,2,1),
            high:Date.UTC(2017,4,30),
            color:'#ff3d3d'
          },
                        {
            x:2,
            low:Date.UTC(2017,2,1),
            high:Date.UTC(2017,5,30),
            color:'#3d3dff'
          },
                        {
            x:2,
            low:Date.UTC(2017,8,1),
            high:Date.UTC(2017,9,30),
            color:'#3d3dff'
          },
        ]
    }]

http://jsfiddle.net/t9rsf6n7/2/