如何從24小時切換到12小時的Highstock圖表？

Question

我正在使用highstock的股票圖表。目前xAxis數據在24小時內爲盤中格式。 我想以12小時的格式顯示xAxis的盤中數據。

你能告訴我如何將24小時時間轉換爲12小時的Highstock圖表嗎？ 我試着用dateTimeLabelFormats，但沒有運氣。

在此先感謝。

Answer 1

對我來說dateTimeLabelFormats工作完全正常，請參閱：http://jsfiddle.net/wmFZx/

$('#container').highcharts({ 
    xAxis: { 
     type: 'datetime', 
     dateTimeLabelFormats: { 
      hour: '%I %p' 
     } 
    }, 

    series: [{ 
     data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4], 
     pointStart: Date.UTC(2010, 0, 1), 
     pointInterval: 2 * 3600 * 1000 // two hours 
    }] 
}); 

Answer 2

對於那些晚歸像我這樣的（2歲以後），試試這個：

tooltip: { 
    xDateFormat: "%A, %b %e, %I:%M%p" 
}, 
xAxis: { 
    dateTimeLabelFormats : { 
    hour: "%I %p" 
    } 
} 

這裏的的jsfiddle：http://jsfiddle.net/4tat369x/

如果您有多個系列並共享工具提示，則需要修改您的圖表類型的dataGrouping dateTimeLabelFormats。下面是折線圖的樣子：

plotOptions: { 
    line: { 
    dataGrouping: { 
     dateTimeLabelFormats: { 
     millisecond: ["%A, %b %e, %H:%M:%S.%L%p", "%A, %b %e, %I:%M:%S.%L%p", "-%I:%M:%S.%L%p"], 
     second: ["%A, %b %e, %I:%M:%S%p", "%A, %b %e, %I:%M:%S%p", "-%I:%M:%S%p"], 
     minute: ["%A, %b %e, %I:%M%p", "%A, %b %e, %I:%M%p", "-%I:%M%p"], 
     hour: ["%A, %b %e, %I:%M%p", "%A, %b %e, %I:%M%p", "-%I:%M%p"], 
     day: ["%A, %b %e, %Y", "%A, %b %e", "-%A, %b %e, %Y"], 
     week: ["Week from %A, %b %e, %Y", "%A, %b %e", "-%A, %b %e, %Y"], 
     month: ["%B %Y", "%B", "-%B %Y"], 
     year: ["%Y", "%Y", "-%Y"] 
     } 
    } 
    } 
}