2

各ノードに円を追加する強制有向グラフを使用しています。

ノード作成の一環として、最初に各ノード円の半径「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」から取得した値に設定したいと考えています。

これを行うための正しい構文は何ですか?

ご協力いただきありがとうございます。

4

1 に答える 1

2

あなたは機能を探していgetAttribute()ます。

したがって、次のようなものがうまくいくはずです:

selectedNodeCircles.attr("r", function() {return this.getAttribute("rSize")})

this私の理解の範囲では、関数内では円そのものであり、DOM 内の単なる要素であることを思い出してください。

これは、ステートメントconsole.log(this)の直前に使用してこれを印刷するだけで確認できます。result

お役に立てれば。

于 2013-07-10T18:05:56.253 に答える