如何在D3 js的可折叠树节点中单击节点后使节点能够拖动？

Question

我想拖动一个节点以重新调整可折叠树，因为该节点后的数据长度较大。 我该如何实现。

我将此代码写在脚本文件中。以下代码用于force.layout。我如何在tree.layout中获得相同的结果。

// drag code

var node_drag = d3.behavior.drag()
  .on("dragstart", dragstart)
  .on("drag", dragmove)
  .on("dragend", dragend);

function dragstart(d, i) {
  force.stop() // stops the force auto positioning before you start dragging    }

function dragmove(d, i) {
  d.px += d3.event.dx;
  d.py += d3.event.dy;
  d.x += d3.event.dx;
  d.y += d3.event.dy;
  tick(); // this is the key to make it work together with updating both px,py,x,y on d !
}

function dragend(d, i) {
  d.fixed = true; // of course set the node to fixed so the force doesn't include the node in its auto positioning stuff
  tick();
  force.resume();
}

function dblclick(d) {
  console.log('Double clicked. ');
  d3.select(this).classed("fixed", d.fixed = false);
}

function tick(d) {
  link.attr("x1", function(d) { return d.source.x; })
   .attr("y1", function(d) { return d.source.y; })
   .attr("x2", function(d) { return d.target.x; })
   .attr("y2", function(d) { return d.target.y; });

  node.attr("transform", function(d) {
    return "translate(" + d.x + "," + d.y + ")";
  });
};