2013-03-04 6 views
6

私はグラフにする必要がある大きな時系列データセットを持っており、D3を使ってそれをしようとしています。私は自分のグラフにx軸があるようにし、グラフをx方向に動かせるようにする予定です。私は、グラフに現在の時間範囲内に存在する点を画面にロード/表示させるだけです。D3データセットの選択部分のグラフ表示

例えば、私のデータセットが1〜100の時間を持つが、グラフが時間1〜10で始まる場合、グラフは点1〜10をグラフ化するだけでよい。次に、ユーザは右に移動して時間5〜15を見ることができ、それに応じてグラフが更新されるはずである。

これはどのようにd3経由で行うことができます誰に説明できますか?一度に読み込まれるデータセット全体からの理解を橋渡しし、データのサブセットの選択的なグラフ表示にすぐにグラフを描くのは苦労しています。

答えて

2

私はあなたがselection.filter()機能を探していると思います。例えば、あなたが持つことができます:あなたはまた、ノードの配列に直接フィルタを適用することができます

var allNodes = vis.selectAll("Nodes").data(data.nodes); 
var validNodes = allNodes.filter(function(d){return (d.time>1 && d.time <10)}); 
//use normal graph functions on validNodes. 

+0

返信いただきありがとうございます。意味をなさないフィルタ関数の境界を動的に設定する方法を動的に知ることはできますか?理想的には、あなたが従うならば、私はx軸の境界を取得したいと思います。彼らが5-15にスクロールした場合、バインドはd.time> = 5 && d.time <= 15などとなります – cdietschrun

+0

これはAPIで見つけることができます:https://github.com/mbostock/d3/wiki/SVG-Axes#ウィキ軸。そうでなければ私は知らない。 –

+1

私はx軸の最小値と最大値を与えるx.domain()と運が良かったです。ドメイン情報でフィルタを使用する必要があるため、これを正しいとマークします。 – cdietschrun