Удалить/Изменить метки в Force Directed Graph

Question

У меня есть этот код для обновления моей силы ориентированного графа, который я буду называть каждый раз, когда я удаляю узлы и ссылки из respectives массивов:

function update_graph() { 

link_update = svg.selectAll(".link").data(
     force.links(), 
     function (d) { 
      return d.source.id + "-" + d.target.id; 
     } 
); 

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

link_update.exit() 
     .remove(); 

node_update = svg.selectAll(".node").data(
     force.nodes(), 
     function (d) { 
      return d.id; 
     } 
); 

node_update.enter() 
     .append("circle") 
     .attr("class", function (d) { 
      return "node " + d.id; 
     }) 
     .attr("r", function (d) { 
      return radio/d.group; 
     }) 
     .call(force.drag) 
     .on('dblclick', connectedNodes); 


//labels 
node_update.enter().append("text") 
.attr("dx", function (d) { 
return (radio-7)/d.group; 
}) 
.attr("dy", function (d) { 
return (radio-7)/d.group; 
}) 
.text(function (d) { 
return d.id; 
}) 
.style("stroke", "black"); 


// Remove the SVG circle whenever a node vanishes from the node list. 
node_update.exit() 
     .remove(); 

// Start calling the tick() method repeatedly to lay out the graph. 
force.start(); 

}

Узлы и ссылки правильно удалены из графика, но метки остаются там, как я могу синхронизировать ярлыки с узлами и показывать только то, что в данный момент находится на графике?

Fiddle тиражирования проблемы: https://jsfiddle.net/vzes4h8y/

Заранее спасибо

Answer 1

Вы можете создать другие переменную для текста

node_updateText = svg.selectAll(".text").data(
     force.nodes(), 
     function (d) { 
      return d.id; 
     } 
).enter(); 

и удаления их соответствующим образом.

Вот скрипка: https://jsfiddle.net/LmqLtr8e/