How To Approach Filtering Nodes And Edges Rendered Via D3.js According To User Preference?

Link to my code (Plunker) I am developing a network diagram in D3.js force layout for academic purpose. I have so far coded a graph which displays nodes and edges. I have an auto-

Solution 1:

In essence, what a user is doing by searching for a specific node name is to narrow the data the visualization is going to show.

The approach

1. First you need to narrow down the source data by using filtering or whatever makes sense in your situation. You end up with filtered data.
2. Then you need to selectAll the nodes that have been drawn already and join the selection with filtered data from step 1.
3. Finally use the d3 enter, update and exit selections to add, update and remove nodes and links.

Example

Mike Bostock published an example of [Modifying a Force Layout].(https://bl.ocks.org/mbostock/1095795)