Javascript 如何制作具有动态日期时间范围的月间隔海图

Javascript 如何制作具有动态日期时间范围的月间隔海图,javascript,highcharts,Javascript,Highcharts,我有一个值数组 [2.6, 3.2, 4.2, 3.3, 2.7, 4.5, 5.9, 2.7, 1.8, 1.7, 1.3, 1.8, 1, 1.4, 1.3, 1.4, 1.1, 1.1, 1, 1.4, 1, 1.4, 1.3, 1.5, 1.1, 1.2, 1.3, 1.3, 0.8, 0.9, 1, 1.1, 1, 1, 0.8] 起始日期为2016年8月1日,即2016年9月 还有一个结束日期——2019/05/01,也就是2019年5月 我需要做一张有yAxis的图表 min:

我有一个值数组

[2.6, 3.2, 4.2, 3.3, 2.7, 4.5, 5.9, 2.7, 1.8, 1.7, 1.3, 1.8, 1, 1.4, 1.3, 1.4, 1.1, 1.1, 1, 1.4, 1, 1.4, 1.3, 1.5, 1.1, 1.2, 1.3, 1.3, 0.8, 0.9, 1, 1.1, 1, 1, 0.8]
起始日期为2016年8月1日,即2016年9月

还有一个结束日期——2019/05/01,也就是2019年5月

我需要做一张有yAxis的图表

min: 0.0
max: 6.0
xAxis是
datetime
类型

到目前为止,我有这个配置

{
  yAxis: [
    {
      min: 0.0,
      max: 6.0,
      title: {
        text: 'Fill Days'
      }
    }
  ],
  xAxis: {
    type: 'datetime',
    min: Date.UTC(2016, 8, 1),
    max: Date.UTC(2019, 5, 1)
  },
  series: [{
    name: 'Some Name',
    type: 'spline',
    data: data.map((item, i) => [Date.UTC(Math.floor(2016 + (i / 12)), (8 * i) / 12, 1), item])
  }]
};
然而,海图看起来并不正确-

我希望从2016年9月到5月19日,数据数组中的每个元素都被一个接一个地取下来,每个月递增一次

Sep 16 - 2.6
Oct 16 - 3.2
Nov 16 - 4.2
...
May 19 - 0.8

您没有考虑从每年的9月开始。一旦更改映射,它将正常工作

var series = data.map((item, i) => [Date.UTC(Math.floor(2016 + ((7 + i) / 12)), (((7 + i) % 12) + 1), 1), item])
请检查以下工作示例:

data=[2.6,3.2,4.2,3.3,2.7,4.5,5.9,2.7,1.8,1.7,1.3,1.8,1,1.4,1.3,1.4,1.1,1,1,1.4,1,1.4,1.3,1.5,1.1,1.2,1.3,1.3,0.8,0.9,1,1,1,1.1,1,1,0.8]
var系列=data.map((项目,i)=>[Date.UTC(数学地板(2016+((7+i)/12)),((7+i)%12)+1),1),项目])
Highcharts.chart('容器'{
亚克斯:[{
最小值:0.0,
最高:6.0,
标题:{
文本:“一些文本”
}
}],
xAxis:{
键入:“日期时间”,
最小值:UTC日期(2016年8月1日),
最大值:UTC日期(2019年5月1日)
},
系列:[{
名字:'某个名字',
类型:“样条线”,
数据:系列
}]
});