d3.js - Is it possible to allow the user to visually alter a graph?

Question

I created a simple graph (it will become more complex, but for the purpose of this example it will do):

function createGraph(){
  var graph = jsnx.Graph();
  graph.add_nodes_from([
[1,{color:'red'}],
[2,{color:'green'}],
[3,{color:'blue'}]
  ]);

  graph.add_edges_from([[1,2],[1,3]]);

  jsnx.draw(graph,{
element: '#my-canvas',
with_labels: true,
node_style:{
  fill: function(d){
      return d.data.color;
    }

}
   }); 
 }

This code successfully draws the graph. Now, I'd like the user to be able to select an edge with the mouse and, when this edge is selected, by pressing the "canc" key the edge should be deleted.

Also, if the user clicks on a node and then drags on another node, he should be able to create an edge.

In short: is d3.js just for visualization or does it allow to visually alter a graph too?

Answer 1

原则上，您可以使用 D3 执行此操作（例如，请参见此处）。但是，您必须实现允许用户自己更改图表的功能。也就是说，D3 没有开箱即用地提供此功能。