2014-09-01 88 views
0

我正在更新节点和链接。我也想改变现有节点(圆圈)的半径。我如何更新例如特定的圈子?如何更新D3中的特定节点

  • 当我这样做下面它更新所有圈子。

    node.select("circle").attr("r", circleradius); 
    
  • 当我更新节点数组时没有任何变化。

    nodes[index].size = 2000; 
    

this is how the outputted html looks like

这是功能更新代码:

function update() { 


     // Restart the force layout. 
     force 
      .nodes(nodes) 
      .links(links) 
      .start(); 


     // Update links. 
     link = link.data(links, function(d) { return d.target.id; }); 

     link.exit().remove(); 

     link.enter().insert("line", ".node") 
      .attr("class", "link"); 

     // Update nodes. 
     node = node.data(nodes, function(d) { return d.id; }); 

     node.exit().remove(); 

     var nodeEnter = node.enter().append("g") 
      .attr("class", "node") 
      .on("click", click) 
      .call(force.drag); 

     nodeEnter.append("circle") 
       .attr("r", function(d) { return Math.sqrt(d.size)/2 || 24.5; }); 

     nodeEnter.append("text") 
         .attr("dy", ".35em") 
         .text(function(d) { return d.name; }); 

     node.select("circle") 
      .style("fill", color); 

    } 

回答

0

子元素,直到您使用d3.select不会自动更新。把我的头放在这里,这是一件很难的事情。

但是出于实际的目的,你需要做的是,在你创建了你的强制驱动的布局和元素等之后,如果你想改变用于size元素0的数据值并且看到它更新,代码需要这样读取:

nodes[0].size = 2000; 
d3.selectAll("g").select("circle") 
    .attr("r", function(d) { return Math.sqrt(d.size)/2 || 24.5; });