問題タブ [stream-graph]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - protovis ストリームグラフをアニメーション化するにはどうすればよいですか?
protovis ストリームグラフをアニメーション化する方法がわかりません。i, j
最善の方法は、単にインデックスの配列を渡し.layers()
て、関数.x()
と.y()
関数に実際の更新値を検索させることだと思います。もっと簡単な方法はありますか?
javascript - Protovisのpv.Layout.Stack(ストリームグラフ)にラベルを追加する
私はProtovisライブラリを使用して、データのストリームグラフを作成しています。さまざまなレイヤーに「words」配列のラベルを付けたいと思います。言葉が思い通りに並んでいないようです。このサイトのように、グラフがその特定のレイヤーで最大の場所に挿入する必要があります。
http://mbostock.github.com/protovis/ex/jobs.html
javascript - D3 リアルタイム ストリームグラフ (グラフ データの視覚化)
この例のようなストリーム グラフが必要です: http://mbostock.github.com/d3/ex/stream.html
しかし、リアルタイム データを右から入力し、古いデータを左から残して、常に 200 サンプルのウィンドウを確保したいと考えています。適切な遷移が得られるようにするにはどうすればよいですか?
配列aのデータポイントを変更してから、そのような領域を再作成してみました
しかし、私のトランジションでは、チャートが画面上をスライドしているようには見えません。
前もって感謝します。
javascript - d3.js: データキーを追加するには?
私は D3.js を学習しており、ストリームグラフで使用されるデータ キーについて理解を深めようとしています。公式のストリームグラフの例を適応させたい:
...各パスに明示的なデータキーがあり、マウスオーバーでデータキーがログに記録されるようにします。
公式の例では、次のようにパスを追加します。
data0
次のようにコードを調整しようとしましたが、 (現在は配列の配列)の構造を変更して目的を達成する方法がわかりません。
現状では、 の構造に変更を加えてdata0
いないため、当然のことながら動作しません。関数と関数を台無しにせずにname
プロパティを追加するにはどうすればよいですか?data0
area
.data()
更新: 少し明確にするために: D3 ドキュメントでは、area 関数は 2 次元配列を期待していると述べています。data0
では、2 次元配列から、それぞれがname
キーとキーを持つオブジェクトの配列に変更した場合、data
渡すものも変更するにはどうすればよいarea
でしょうか?
matplotlib - matplotlib の積み上げ折れ線/面グラフ
matplotlib について質問があります。私がやっていることは、ある意味で統計的/数学的に正しくないことは既に知っていますが、積み上げ折れ線/面グラフを使用してとにかく視覚化したいと考えています。
私が行った測定では、同じ x 軸を基準として使用していません。つまり、異なる行には同じ数のデータ ポイントがないということです。時間を x 軸として使用したいのですが、測定値はまったく同じタイムスタンプとは関係ありません (分散システムを考えてください)。
私の質問は、「自分で補間を行わずに、matplotlib でそれを行うことはできますか?」ということだと思います。
ここで、積み上げグラフとは何かについての詳細な説明: http://www.leebyron.com/else/streamgraph/download.php?file=stackedgraphs_byron_wattenberg.pdf
乾杯、マーク
javascript - ラファエルの積み上げ折れ線グラフまたはストリームグラフ?
Raphael の積み上げグラフ (またはストリーム グラフ) の例はありますか?
このD3 ストリームグラフに相当する Raphael が機能しているかどうか疑問に思っています。
私が見た中で最も近いのは、この折れ線グラフの例です。
これに基づいて積み上げグラフを作成することもできると思いますが、アウトライン コードを既に持っている人がいれば幸いです。
javascript - x、y、y0以外のプロパティをd3のストリームグラフのレイヤーにアタッチするにはどうすればよいですか?
私はd3の初心者で、Streamgraphの例(http://mbostock.github.com/d3/ex/stream.html)をカスタマイズしようとしています。
私はいくつかの問題に遭遇しました:
ストリーム内の各レイヤーにカスタムデータプロパティ(たとえば、「type」というラベルを付けます)を割り当てて、そのレイヤーにカーソルを合わせると、「type」がリストされたポップアップボックスが表示されるようにします。その層。
データソースをグラフに入力するときは、次のコードを使用します。
グラフは次の形式のデータのみを取得しているようです。
上記の各サブ配列は、ストリームグラフのレイヤーに対応しています。
各レイヤーに追加の「タイプ」プロパティを追加できるデータをグラフに渡すにはどうすればよいですか?
基本的に、レイヤーのデータムを参照するときに、d.typeのようなものを入力して、そのプロパティを抽出できるようにしますか?
私はもともとそれを行うための本当にハックな方法を思いついた:
次に、レイヤーデータでd [0] .typeと言って参照しますが、これは適切な方法ではないようです。
javascript - ストリーミング グラフ: 2 つの質問
私は D3.js で遊んでいて、リアルタイム データを使用してストリーミング グラフの視覚化を作成しようとしています。
私はこの記事をよく勉強しました http://bost.ocks.org/mike/path/
私もこの質問と回答を読ん で、四角形内のSvgクリップパスは機能しません が、これは行用です。私は d3.svg.area オブジェクトを持っています
次に、この記事 D3 Real-Time streamgraph (Graph Data Visualization)を読みまし たが、まだ答えが見つかりませんでした
私の2つの質問:
ストリーミング グラフを描画するときに、グラフが常に下部に設定されていることに気付きました。計算関数を更新するたびに、最大のデータが検出され、グラフを描画する要素の下部にグラフの下部が設定されます。
/li>
グラフを軸の中央に配置するにはどうすればよいですか? エリアのx、y0、y1をいじる必要があると思いますが、正確にはどうすればよいですか?
私のコードを試すと、グラフの一部が左側に表示されます。私は何か問題があることを知っています:
/li>
他のトピックやウェブ全体で応答を検索しますが、ここで立ち往生しています!
これが私のコードです:
javascript - D3 Streamgraphでのstack.values([accessor])の正しい使用法は?
D3 APIリファレンスとStackOverflowのこの質問に示されているように、値アクセサーを使用してレイヤーごとに追加のデータを含むD3ストリームグラフチャートを作成しようとしています。
タイトルは正常に追加されますが、値が追加されていないようです。何がうまくいかないかについてのアイデアはありますか?
私はd3を初めて使用するので、簡単だと確信しています。コードは以下のとおりです。
javascript - D3 ストリームグラフの配列形式
https://github.com/mbostock/d3/wiki/Stack-Layout
http://mbostock.github.com/d3/ex/stream.html
D3.jsでストリームグラフを作ろうとしています。例を見ると、データがヘルパー関数によって定式化されていることがわかりますstream_layers(n, m)
。この例では、API で説明されているように配列が返されます。API は、入力 x、y、および y0 を記述します。ただし、この例では x、y0、y1 を使用しています。
私のデータセットは、API で説明されているものと同様に定式化されています。
このデータセットをスタックするヘルパー関数はどのようになりますか? この例では、3D 配列が返されます (1 つはレイヤー数、1 つはサンプル数、1m
つは各サンプルの y 値)。