如何创建系列和设置X和Y轴？

Question

我必须制作如图所示的系列。

日期和值是根据用户选择动态生成的。时间是24小时格式。请告诉我如何为此创建系列。另外如何将持续时间为1小时的时间值。

参考图片：

Answer 1

在您使用data: [Date.UTC(2012, 10, 01, 12,11,10)]的系列数据中，您只需将其更改为：data: [90 *60 * 1000] //For 90 Minute

以下是LIVE DEMO

如果您想为其他日子绘制其他系列，那么您应该在xAxies中添加类别。例如显示3天：

xAxis: {
  categories: ['01/10/2012', '01/11/2012', '01/2/2012']
},

在系列数据中，使用与3类别的类别相同数量的参数：

data: [ 50 *60 * 1000, 100 *60 * 1000, 50 *60 * 1000 ]

请参阅LIVE DEMO

在悬停系列时，在工具提示中使用formatter查看正确的hour:minutes。

tooltip: {
  formatter: function() {
    var ms = this.y;
    var x = ms / 1000;
    var seconds = x % 60;
    x = x / 60;
    var minutes = x % 60;
    x = x / 60;
    var hours = parseInt(x % 24);
    x = (x / 24);
    var days = parseInt(x);
    if(days == 0)
    {
      return  '<b>' + this.series.name +'</b> ->' + this.x + '<br/>' + hours +':' + minutes;
    } else {
      return  '<b>' + this.series.name +'</b><br/>' + days + ' Day ' + hours +':' + minutes;
    }
  } 
},

请参阅LIVE DEMO