2013-10-02 36 views
1

我有一個11 MB的數據集。每次加載文檔時加載速度很慢。如何處理d3js中的大數據集

d3.csv("https://s3.amazonaws.com/vidaio/QHP_Individual_Medical_Landscape.csv", function(data) { 
    // drawing code... 
}); 

我知道,交叉過濾器可用於在瀏覽器中加載數據後進行切片。但在此之前,數據集很大。我只使用數據的聚合。看起來我應該在將數據發送到客戶端之前預先處理服務器上的數據。也許,在服務器端使用crossfilter。有關如何處理/處理d3大型數據集的任何建議?

+0

就像你說的那樣,在服務器上進行預處理。或者只有彙總值的文件的較小版本。 –

+0

嗯也許你應該添加一個加載屏幕。我不認爲服務器端交叉過濾會更快。 – 0xcaff

+0

@caffinatedmonkey,我可以將數據存儲在我們的mongodb後端,而不是從URL加載。 –

回答

1

您的數據是否動態?如果不是,那麼你肯定可以聚合它並將結果存儲在你的服務器上。聚合只需要一次。即使數據是動態的,如果更改不頻繁,那麼只有當數據更改並緩存結果時才能從聚合中受益。如果您擁有高度動態的數據,以至於每次加載頁面時都必須重新彙總數據,那麼在服務器上與客戶端上進行數據交換可能取決於您期望的併發用戶數量。許多同時使用的用戶可能會讓服務器癱瘓。 OTOH,如果您的用戶數量很少,那麼您的服務器可能(可能?)比用戶的瀏覽器具有更大的功能,在這種情況下,它可以比瀏覽器更快地執行聚合。還要記住向用戶發送11 MB的帶寬成本。可能不是什麼大問題,除非他們大量地加載頁面並在移動設備上進行。

+0

數據是靜態的,但我想在動態數據周圍構建動態過濾器。 crossfilter看起來很合適。 –

+0

然後你可能別無選擇,只能將文件加載到瀏覽器中。儘管可以在node.js服務器上運行的npm版本的crossfilter,但您必須創建一種機制來在瀏覽器和服務器之間進行通信,以動態更改過濾器並更新數據。 –

+3

你是否需要數據集中的所有字段?否則,通過刪除多餘的列進行預處理可能會有所幫助。您還可以縮短個別值,例如將美元值轉換爲簡單整數(例如「120」而不是「$ 120.00」)。 –

0
  • 嘗試簡化數據(也有人從斯蒂芬·托馬斯的評論)
  • 嘗試數據預處理解析成JSON。這可能會導致更大的文件(更多的網絡時間),但解析開銷更低(客戶端cpu較低)。如果您的問題是解析,這可以節省時間
  • 通過某種分片鍵(如year)分解數據。限制到該分片,然後根據需要按需加載其他數據文件
  • 按時間分解數據,但在UI中顯示所有內容。在默認視圖(例如最近的時間框架)上加載圖表,但隨後在它們到達時(或當它們全部到達時)異步添加附加文件
0

服務器端(gZip)壓縮如何?在壓縮後應該是幾kb,並且瀏覽器將在後臺解壓縮。