2013-02-02 79 views
0

我用mySQL數據庫中的數據創建了一個簡單的線圖,使用PHP以JSON格式返回數據。「Live」圖d3.js與模擬數據

https://gist.github.com/5fc4cd5f41a6ddf2df23

我想模擬「實時」更新與此示例類似的東西,但不太複雜: http://bl.ocks.org/2657838

我一直在尋找如何實現這個簡單的新實例D3 - 無濟於事。

我已經看過Mike Bostock的http://bost.ocks.org/mike/path/路徑轉換,但不知道如何使用json數據實現這個。

任何人都可以幫助一個例子或一些方向我怎麼能做到這一點?

回答

2

在SVG中做這種線條轉換很棘手,因爲只需稍稍移動大量的並且重新渲染完整的線條可能會損害性能。

對於與每個數據點的交互性不重要且時間序列可以增長以包含任意數量的點的情況,請考慮使用Cubism。這是一個基於d3的庫,但專門用於高效地時間序列數據的可視化。爲了防止SVG的重新渲染,它在畫布上繪製點,以便在新數據到達時實現便宜的逐像素過渡。

+1

謝謝 - 立體主義只允許時間序列圖表?從我從API中看到的情況看起來就是這樣 - 也許我錯了?我需要使用線圖的佈局http://bl.ocks.org/2657838 – Newbie

+0

是的,只有地平線和比較圖表。我認爲所需佈局的一部分可以用立體主義和一些明智的顏色設置,並通過選擇適當的比例來模仿,但是,立體派是指非常特定的圖書館。在這種情況下,構建自己的線形圖(如您的示例)將使您獲得更大的靈活性。 –

+0

謝謝 - 閱讀更多關於立體派的信息,它確實看起來更有效率。儘管如此,似乎沒有太多的信息或許多例子。我的數據是JSON格式 - 我將如何去實現一個Cubism時間序列圖使用這種類型的數據源?任何方向或例子將不勝感激。 – Newbie