d3.jsのサークルノードの属性を変更するにはどうすればよいですか？

Question

次のコードは、今私は、個々のノードがhttp://bl.ocks.org/d3noob/5141528に類似したイベントを、クリック、クリック（）関数の助けを借りてthierサイズを大きくするように反応するようにしたいhttp://my-neo4j-movies-app.herokuapp.com/

に基づいてグラフを表示しますが、属性は」doesnのt変化。私は2つの行に（ "円"）

.ATTR（ "R"、5） 'ノード' コードブレークの変数の定義における

を

.appendを削除した場合。 2番目の例では

<script type="text/javascript"> 
var width = screen.width, height = screen.height; 
var force = d3.layout.force().charge(-200).linkDistance(30) 
.size([width, height]); 
var svg = d3.select("#graph").append("svg") 
     .attr("width", "100%").attr("height", "100%") 
     .attr("pointer-events", "all"); 

d3.json("/graph", function(error, graph) { 
    if (error) return; 

    force.nodes(graph.nodes).links(graph.links).start(); 

    var link = svg.selectAll(".link") 
      .data(graph.links).enter() 
      .append("line").attr("class", "link"); 
    var node = svg.selectAll(".node") 
      .data(graph.nodes).enter() 
      .append("circle") 
      .attr("r", 5) 
      .attr("class", function (d) { return "node "+d.label }) 
      .on("click", click) 
      .call(force.drag); 

    // add the nodes 
    node.append("circle").attr("r", 5); 
    // html title attribute 
    node.append("title").text(function (d) { return d.title; }); 
    // force feed algo ticks 
    force.on("tick", function() { 
     link.attr("x1", function(d) { return d.source.x; }) 
       .attr("y1", function(d) { return d.source.y; }) 
       .attr("x2", function(d) { return d.target.x; }) 
       .attr("y2", function(d) { return d.target.y; }); 
     node.attr("cx", function(d) { return d.x; }) 
       .attr("cy", function(d) { return d.y; }); 
    }); 

    // action to take on mouse click 
    function click() { 
     console.log(d3.select(this)); 
      d3.select(this).select(".circle") 
      .attr("r", 26) 
      .style("fill", "lightsteelblue"); 
    } 

}); 

Answer 1

"ノード" は、このようなサークルやテキストでg要素です：

<g> 
    <circle /> 
    <text>some text</text> 
</g> 

クリックでだから、このコード：

d3.select(this).select(".circle") 

はgを選択し、クラスサークルで最初のものを取得していると言います（サークル）。

あなたのコードは、ノードは単なる円です。だから、クリックで、これをやってみましょう：

d3.select(this) 
    .attr("r", 26) 
    .style("fill", "lightsteelblue");