score:4

Accepted answer

This is wrong:

function removeNode()
  {
     this.remove();//it will remove only the link.
  }

You can do something like this to remove the node and all its children.

function removeNode(d)
{
  //this is the links target node which you want to remove
     var target = d.target;
     //make new set of children
     var children = [];
     //iterate through the children 
     target.parent.children.forEach(function(child){
       if (child.id != target.id){
         //add to the child list if target id is not same 
         //so that the node target is removed.
         children.push(child);
       }
     });
     //set the target parent with new set of children sans the one which is removed
     target.parent.children = children;
     //redraw the parent since one of its children is removed
     update(d.target.parent)
}

working example here

Hope this helps!

score:0

Answer above is correct, but sometimes it's not working with d3 v4.

In v4 you can't add empty children array, instead, you should set it as null

So, just add

if (children.length === 0) {
    children = null;
}

before updating target.parent.children


Related Query

More Query from same tag