各ノードに円を追加する強制有向グラフを使用しています。
ノード作成の一環として、最初に各ノード円の半径「r」をデフォルトの一貫した値 (defaultNodeSize = 10) に設定します。これにより、関連するすべてのノードが同じサイズのクラスターが正常に描画されます。
// Append circles to Nodes
node.append("circle")
.attr("x", function(d) { return d.x; })
.attr("y", function(d) { return d.y; })
.attr("r", function(d) { if (d.id==focalNodeID) { return centerNodeSize; } else { return defaultNodeSize; } } ) // <---------------------------- Radius "r" set HERE!!!!
.style("fill", "White") // Make the nodes hollow looking
.attr("type_value", function(d, i) { return d.type; })
.attr("color_value", function(d, i) { return color_hash[d.type]; })
.attr("rSize", function(d, i) { return d.rSize; }) // <------------------ rSize HERE!!!!
.attr("id", "NODE" )
.attr("class", function(d, i) {
var str = d.type;
var strippedString = str.replace(/ /g, "_")
//return "nodeCircle-" + strippedString; })
if (d.id==focalNodeID) { return "focalNodeCircle"; }
else { return "nodeCircle-" + strippedString; }
})
.style("stroke-width", 5) // Give the node strokes some thickness
.style("stroke", function(d, i) { return color_hash[d.type]; } ) // Node stroke colors
.call(force.drag);
また、作成時に、そのノードの絶対的な大きさを指定する「rSize」という属性を設定しました。各ノードには異なる rSize があり、rSize は defaultNodeSize とは異なります。rSize の目的は、後でアクセスして、円の半径を defaultNodeSize から rSize (またはその逆) に動的に変更し、コントローラーに基づいて各ノードを拡大または縮小できるようにすることです。
別のコントローラー関数で、後で新しい rSize を適用するすべてのノードを選択します。それらを選択するのは簡単です...
var selectedNodeCircles = d3.selectAll("#NODE");
ただし、各ノードの rSize を読み取り、変更されている特定のノードに rSize を適用する構文が何であるかはわかりません。私はそれが次のようなものだと思うでしょう...
selectedNodeCircles.("r", function(){ return this.attr("rSize"); });
つまり、特定のノードの「rSize」属性値を取得し、属性「r」を「rSize」から取得した値に設定したいと考えています。
これを行うための正しい構文は何ですか?
ご協力いただきありがとうございます。