Mike Bostock TidyTreeを使用してツリーを作成しています
ここにいる何人かの人々の助けを借りて、私はマウスを置いたノードからルートまでのパスをノードに強調表示する機能を実行しました。また、すべてのノードとリンクの色をリセットすることで、色/ストロークをリセットする簡単な機能も実行しました。しかし今、私はノードからルートを通過する別のノードへのパスを強調したいと思います。
たとえば、ABCという外部ノードがXYZという別の外部ノードに接続されている場合、ABCがルートに、XYZがルートに強調表示されるため、両方が接続されていることがわかります。
コンピューターに理解させるために、2つの方法を考えました。IDの最後にタグを追加します。たとえば、互いにペアになる各外部ノードの#1のように、または12のようなノードに値を追加します。どちらもcsvファイルにあります。
その後、スクリプトですべてのノードをチェックして、(マウスを置いているノードの)終了IDまたは値が同じノードを見つけ、ホバーしたノードの場合と同じ方法で、このノードからルートまでハイライト表示します。
では、どちらのアイデアが良いのでしょうか?それも可能ですか?ノードIDにアクセスして文字列を確認したり、ノード値にアクセスしたりできますか?はいの場合、どうすればそれを行うことができますか?私はこれを考えました:d3.selectAll("node[value='12']");
例えば値のために、しかしこの方法で私は私の方法を使って彼の両親に戻る方法を知りません。
色を変更するために使用する方法は次のとおりです。ルートへの親パスを強調表示します
誰かがこれについて私を助けることができますか?
ありがとう!
さて、私はそれをなんとかすることができました、私はマウスオーバーで一時変数を作成しました。IDと値はノード内のdataというオブジェクトにあるため、必要な実際の属性の前にデータにアクセスする必要があります。値をidに置き換えるか、単にdata.valueを取得する属性に置き換えることができます。
node.on("mouseover", function(p) {
if(p.data.value != "")
{
var temp = p.data.value
console.log(temp)
}
次に、値がグラフ上の別のノードとペアになっているかどうかを確認し、最初のノードで行ったのと同じ方法で、ペアになっているノードで強調表示を行います。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加