如何創建系列和設置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