D3 または Rickshaw でズーム可能な Google Finance スタイルの時系列グラフを作成できますか? [closed] 質問する

D3 または Rickshaw でズーム可能な Google Finance スタイルの時系列グラフを作成できますか? [closed] 質問する

D3で時系列の折れ線グラフを作成し、その下のグラフの小さいバージョンでユーザーがチャートの特定のセクションを拡大表示できるようにしたい。Google Finance のグラフ

私が見つけた最も近い例は、このスイムレーン チャートです。

http://bl.ocks.org/1962173

D3 の折れ線グラフでこれを実行した例はありますか?

注意:私は、純粋にドラッグ/ズーム可能なX軸ではなく、サイズ変更可能なブラシが付いたグラフの小さいバージョンを絶対に欲しいです。この例

理想的には、人力車しかし、人力車の例は範囲スライダーしかないようです. ですから、人力車の例はさらに良いでしょう。

ベストアンサー1

NVD3非常にクールなプロジェクトであり、再利用可能なチャートD3に書かれている。ここビューファインダー付きの折れ線グラフの例とソースコード。

NVD3.js ビューファインダー付き折れ線グラフ

アップデート:NVD3の例は、Mike Bostock (D3 の作成者) の、同様の機能、つまり、純粋に D3.js で実装された、データの選択範囲にズーム/フォーカスする機能を示しています。

D3.js ブラッシングによるフォーカス+コンテキスト

おすすめ記事