Dojo折線圖來自JSON，具有多個系列和常見的x軸

我相信我正在努力完成的任務應該是一項相當普遍的任務，但我很難完成它的工作。我只是希望從包含（對於每個記錄）ISO8601時間戳和多個數據點的數據集創建多系列圖。數據採用JSON格式，我使用的是dojox.charting.chart「Lines」類型。Dojo折線圖來自JSON，具有多個系列和常見的x軸

我已經意識到Dojo圖表不能直接處理基於時間軸的數據，更不用說ISO8601了。所以我已經處理了將x軸轉換爲T0服務器端以來的毫秒數。

這裏是我的JSON的蒸餾水例子摘錄：

[{"Offset_ms":0,"CP":250.58368,"TP":181.88211}, 
{"Offset_ms":360000,"CP":233.18443,"TP":119.94824}, 
{"Offset_ms":540000,"CP":227.15465,"TP":117.99422}, 
{"Offset_ms":720000,"CP":222.87495,"TP":117.55895}, 
{"Offset_ms":896000,"CP":218.19876,"TP":117.64221}, 
{"Offset_ms":900000,"CP":219.77487,"TP":117.93475}]

而且蒸的JavaScript（假設上面的JSON是在變量 'sequenceData'）：

var chart = new dojox.charting.Chart("sequenceDataGraph"); 

chart.addPlot("default", { 
    type: "Lines", 
    tension: "X" 
}); 
chart.addAxis("x", { labelFunc: labelTimeAxis }); 
chart.addAxis("y", { vertical: true }); 

var sequenceDataStore = new dojo.store.Observable(new dojo.store.Memory({ 
    data: { 
     label: "Sequence", 
     items: sequenceData 
    } 
})); 

addSequenceDataSeries(chart, sequenceDataStore, "TP"); 
addSequenceDataSeries(chart, sequenceDataStore, "CP"); 

chart.render(); 

function addSequenceDataSeries(chart, sequenceDataStore, sColumnName) { 
    chart.addSeries(sColumnName, new dojox.charting.StoreSeries(sequenceDataStore, { query: {} }, 
        sColumnName)); 
}

什麼似乎是是因爲Dojo Chart根本不使用x軸數據，而是根據數據點的數量以固定間隔繪製每個點。也就是說，每個數據點似乎都被分配了一個序數，例如如果Offset_ms僅僅是1,2,3 ......由於我的數據點總是以固定的時間間隔爲而不是，因此產生的圖形會失真。

如何指示Dojo圖表使用JSON數據中的「Offset_ms」字段作爲x軸組件？

我已經搜索了教程，API文檔並執行了大量SO搜索無濟於事。我甚至瀏覽過Dojo源代碼的一部分，特別是StoreSeries.js.uncompressed.js，但我找不到任何答案。當然這是可能的，並且希望是微不足道的！

來源

2012-06-13 BrandonLWhite

不幸的是，官方的dojo文檔嚴重缺乏，我只知道如何通過瀏覽dojo源代碼來做類似的事情。具體而言，StoreSeries測試的第135行http://archive.dojotoolkit.org/nightly/dojotoolkit/dojox/charting/tests/test_StoreSeries.html

StoreSeries構造函數的第三個參數接受一個將X軸和Y軸映射到數據存儲區中特定字段的對象。

改變你下面的代碼行從這樣的：

chart.addSeries(sColumnName, new dojox.charting.StoreSeries(sequenceDataStore, { query: {} }, 
       sColumnName));

這樣：

chart.addSeries(sColumnName, new dojox.charting.StoreSeries(sequenceDataStore, { query: {} }, 
       { x: "Offset_ms", y: sColumnName }));

sColumnName成爲{ x: "Offset_ms", y: sColumnName }

來源

2012-06-13 16:29:37

謝謝，它的工作原理！作爲後續工作，我應該如何知道這種初始化第三種叫做「價值」的替代方法？從Dojo API文檔：「函數，它接收一個對象句柄，併產生一個可能檢查商店項目的輸出;或者一個字典對象，它告訴從對象中提取什麼名稱以及如何將它們映射到輸出。字符串，這是一個用於繪圖的數字字段名稱，如果未定義，則爲null或空字符串（默認值），則會提取「value」字段。 - 這很好，但沒有什麼字典的關鍵/瓦爾可以！ – BrandonLWhite

Dojo折線圖來自JSON，具有多個系列和常見的x軸

回答

相關問題