6


我已经访问过在 D3js 中添加和删除节点，但它并没有解决我的问题。

第一次有一些节点，然后我想动态添加节点并希望如果节点已经存在，它会更新该节点并且不要重复。

现在它正在复制而不是更新现有的。
这是主要代码和完整代码，工作小提琴在这里

//handles node elements
var circles = svg.selectAll('g');


//update graph (called when needed)
function restart() {

/***************************************
    Draw circles (nodes)
****************************************/


circles = circles.data(data.nodes);

var g = circles.enter()
               .append("g")
               .attr("class", "gNode")
               .attr("cursor", "pointer")
               .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; })
               .call(force.drag);



g.append("circle")                      
.attr({
     "class": "node", 
     "cx": function(d) { return rScale(d.NumOccurrences); },
     "cy": function(d) { return rScale(d.NumOccurrences); },
     "r": function(d) { return rScale(d.NumOccurrences); }
 })             
 .style("fill", function(d, i) { return colors(i); })
 .style("stroke", "#000");



 g.append("text")
.attr({
    "x": function(d) { return rScale(d.NumOccurrences); },
    "y": function(d) { return rScale(d.NumOccurrences); },
    "font-family": "sans-serif",
    "font-size": "20px",
    "fill": "black",
    "text-anchor": "middle"
   })
   .text( function (d) { return d.name; });

   g.append("title")        
    .text(function(d) { return d.name; });

 // remove old nodes
 circles.exit().remove();

 // set the graph in motion
 force.start();
 }

// app starts here
restart();


 function dynamicAddNodes() {

var updatedata = {"name":"ios","NumOccurrences":"500","color":"green","x":0,"y":1}

data.nodes.push(updatedata);    

restart();
 }

 setInterval(dynamicAddNodes, 10000);
4

2 回答 2

3

试试看：

circles = circles.data(data.nodes,function (d) {
     return d.id;
   });

节点的 ID 是唯一的。

你可以看到：jsfiddle.net/MoHSenMHS/5r62N/

于 2013-10-31T16:30:08.627 回答
1

您的问题不是更新节点过程，而是您将它们更新到的数据。

运行时restart()，它不会从数据中删除任何节点，它只是添加它们。由于数据永远不会被带走，因此节点永远不会被带走。每次调用该函数时，都会添加一个新的数据节点，并添加一个与该数据节点对应的新圆圈。

我在这里更新了您的示例以显示此行为。每次更改数据时，我都会从您的数据中删除一个条目，并将其替换为新的数据点。

于 2013-07-15T14:55:22.750 回答