Highcharts 12小時x軸標籤的時間格式

我有一個Highcharts柱狀圖，它有24個不同的y值，這些y值對應於0-23的x值，代表當天的小時。Highcharts 12小時x軸標籤的時間格式

不Highcharts已經內置了幾個小時0-23，這樣我可以有X軸顯示的時間標籤，這樣的格式：

上午12點，凌晨1點......中午12點，下午1點... .11pm ??

我試過，但Highcharts忽視的x值：

series: [{ 
    name: 'Time of Day', 
    data: [['12am', 6],['1am', 1],['3am', 1],['5am', 1],['7am', 2],['8am', 19],['9am', 54],['10am', 80],['11am', 73],['Noon', 92],['1pm', 105],['2pm', 87],['3pm', 100],['4pm', 74],['5pm', 59],['6pm', 38],['7pm', 24],['8pm', 7],['9pm', 10],['10pm', 4],['11pm', 8],] 
}]

編輯：

的數據可能不包括每隔一小時值，你可以在這個樣本數據看。

來源

2014-02-27 lilbiscuit

您可以分別定義您的x軸標題和系列。

 xAxis: { 
      categories: ['12 am', '1 am', '2 am', '3 am', '4 am', '5 am', '6 am', '7 am', '8 am', '9 am', '10 am', '11 am', 'Noon', '1 pm', '2 pm', '3 pm', '4 pm', '5 pm', '6 pm', '7 pm', '8 pm', '9 pm', '10 pm', '11 pm'] 
     } 

     series: [{    
      name: 'Time of Day', 
      data: [6, 1, 3, 1, 1, 3, 2, 19, 30, 54, 80, 73, 92, 105, 87, 100, 59, 38, 24, 7, 10, 4, 8, 10] 
     }]

Edit-- 如果您還沒有全部小時的數據，您可以定義X軸爲datetime和系列中的特定時間提供值。

 xAxis: { 
      type: 'datetime', 
     }, 
     series: [{ 
      name: 'Time of Day', 
      data: [ 
       [Date.UTC(2014, 2, 28, 10), 5 ], 
       [Date.UTC(2014, 2, 28, 12), 33 ], 
       [Date.UTC(2014, 2, 28, 13), 20 ], 
       [Date.UTC(2014, 2, 28, 15), 26 ] 
      ] 
     }]

來源

2014-02-27 00:24:58 Riz

本手冊方法的問題（我的應用程序，反正）是有可能不是每個小時的值。如果count> 0，mysql查詢只會在hour_of_day-> count上返回一個key-> value對。這就是爲什麼這個問題是針對內置時間函數的。 – lilbiscuit

編輯我的答案，以迎合你的情況。您也可以在此格式化您的xAxis [鏈接]（http://api.highcharts.com/highcharts#xAxis.type） – Riz

您可以指定的日期/時間的格式使用PHP的strftime格式，http://php.net/manual/en/function.strftime.php顯示。

因此，例如，如果要將小時數（何時以及是否顯示）和分鐘數（何時以及是否顯示）更改爲12小時格式，請使用%I而不是%H。

xAxis: { 
    type: 'datetime', 
    dateTimeLabelFormats: { 
     day: '%e of %b', 
     minute: '%I:%M', 
     hour: '%I:%M' 
    } 
}

的jsfiddle - http://jsfiddle.net/xya6kato/

來源

2017-08-21 00:22:47 skin

這是正確的答案。請注意PHP文檔引用並使用這些。謝謝皮膚。 –

Highcharts 12小時x軸標籤的時間格式

回答

相關問題