2013-07-19 86 views
0

我有15分鐘的時間間隔明智數據繪圖。 我的情況下日期可能不一致。日期時間在高圖上繪圖

樣本格式: VAR行= 「2012-02-29」, 「00:15」, 「0」]

我正在從Java類中的數組繪製。

我試圖像幾個選項:

var tempVal = new Array(); 

    for(var i=0;i<row.length;i++){ 

     var record = row[i].split(","); 
     tempVal[i]=Date.UTC(record[0].substring(0,4), record[0].substring(5,7), record[0].substring(8,10), record[1].substring(1,3), record[1].substring(4,7)), record[2]; 

} 

在Highcharts: 系列:[{ 數據:tempVal }]

,但我無法繪製該上Highcharts 。

任何指導將有所幫助。

回答

1

要在HighCharts上繪製日期時間,您需要日期時間值和y值。 它應該看起來像下面這樣:

data: [ 
       [Date.UTC(2010, 0, 1), 29.9], 
       [Date.UTC(2010, 2, 1), 71.5], 
       [Date.UTC(2010, 3, 1), 106.4] 
      ] 

或者你可以取代Date.UTC(2010, 0, 1)具有同等JavaScript的時間值。

Date.UTC()可以接受幾種不同的格式。見here

所以你需要做的是將你的日期值和你的時間值合併成一個單一的時間值。

查看您的示例代碼後編輯您有幾個問題。對於你的數據數組tempVal被聲明爲錯誤。它應該是:

var tempVal = []; 

你也應該使用array.push獲取數據到tempVal陣列。

另一個問題是,你的時間序列似乎沒有按照時間順序 - 當我的系列設置正確時,我得到的區域「線」來回。

這就是我想到的是,你需要修復你的數據數組聲明,以及如何將數據分配給該數組。這是一個非常簡單的方法,它當然可以進行得更快,但我喜歡冗長:

for (var i = 0; i < row.length; i++) { 
    var record = row[i].split(","); 
    var xVal = Date.UTC(parseInt(record[0].substring(0, 4)), parseInt(record[0].substring(5, 7)), parseInt(record[0].substring(8, 10)), parseInt(record[1].substring(1, 3)), parseInt(record[1].substring(4, 7))); 
    var yVal = Math.random() * 10; 
    var x = [xVal, yVal]; 
    tempVal.push(x); 
} 

見更新例如here。請注意,這些線條來回走動 - 正如我所說的,這與您的時間序列不按時間順序排列有關。還要注意,月份是基於0的,所以Jan = 0和Dec = 11。

+0

謝謝,但我曾嘗試把在日的日期和時間。 UTC()但仍然沒有繪製任何東西。數據是15分鐘的時間間隔數據,但日期可能不一致。請告知 – user2599730

+0

「日期可能不一致」並不重要。我們將會看到更多的代碼,或者更好的代表jsFiddle,展示一些示例數據以及您所面臨的問題。 – wergeld

+0

我在http://jsfiddle.net/QcFW7/2/上創建了一個示例。 – user2599730

0

控制檯中是否有錯誤?如果你有你發佈的代碼,你應該有一個。

關於Highcharts - 它需要的值應該是數字,而不是字符串,國有企業,例如:record[2]前應分析,例如:parseFloat(record[2])

+0

請看看我的[問題在這裏](http://stackoverflow.com/questions/27983248/need-help-in-plotting-a-chart-using-highcharts -in-angularjs) – abi1964