d3.js 強制指向レイアウトを使用して、インタラクティブなグラフの視覚化に取り組んでいます。ユーザーがノードのセットを 1 つずつクリックして選択できるようにしたいと考えています。選択したセットに対してユーザーが実行できる一連の計算があります。たとえば、ユーザーは 2 つの異なるノードを選択し、それらの間の最短パスを計算するようシステムに要求できます (存在する場合)。
したがって、問題は、選択したノードのセットをどのように表現して、(a) ユーザーがセットからノードを追加および削除できるようにするか、(b) 選択したノードを視覚化する (たとえば、それらを強調表示することによって)、および (c) ことができるようにすることです。 ) ノードで計算を実行します。
d3 パイプラインのさまざまなポイントで機能するいくつかの異なるオプションが表示されます。
1 つは、ノードが選択されているかどうかを示すフラグをデータ自体に設定することです。ノードの強調表示は簡単です。さまざまなスタイルおよび属性関数が d.selected フラグを調べます。ただし、ノードの選択と選択解除を処理するための最良の戦略が何であるかはわかりません。データ値を設定してから、d3.selectAll.data.enter.. の全体を再実行しますか?
もう 1 つのオプションは、選択したノードの個別の配列をグローバル変数として保持することです。これにより、ノードのセットを簡単に見つけることができます。強調表示を実装するために、スタイル/属性関数は、指定されたノードがセット内にあるかどうかを確認します。繰り返しますが、ノードがセットに追加または削除されたときに視覚化を変更する方法がわかりません。
最後のオプションは、クリックした瞬間に各ノードのスタイル/属性を変更することです。しかし、選択したノードのセットをどのように決定すればよいでしょうか?
どんなアドバイスでも大歓迎です！