javascript - 如何检测 d3.js 力定向图中的元素拖动

Question

我在 d3.js 中有一个力导向图(非常棒:对 MB 和所有参与者的巨大荣誉!)。我希望能够以某种方式检测并返回当前正在拖动的任何节点的索引。

我知道我可以重新定义 d3.behavior.drag() 以将回调附加到拖动事件，但我想要 native force.drag 的所有行为并且为了添加这个而重复所有行为似乎很笨拙一点。以我的经验不足，也许我忽略了一些直接的方法来做到这一点？

---

嗯，是的，我应该更明确一点。这是我尝试过的:我使用了示例 here作为我的模型，修改它以适合我的目的，并在我去的时候学习 d3.js。我这样定义节点:

var circle = svg.append("svg:g").selectAll("circle")
    .data(force.nodes())
  .enter().append("svg:circle")
    .attr("class", "node")
    .attr("r", 6)
    .on("click", clicked)
    .on("dblclick", dblclick)
    .on("contextmenu", cmdclick)
    .on("drag", draghandler)
    .call(force.drag);

function draghandler(d){
    console.log(d);
    console.log(this);
}

click、dblclick 和 contextmenu 的事件处理程序完全符合我的预期；但是，当我尝试为 drag 添加事件处理程序时，它永远不会执行。我想象它失败是因为我用错了它，或者在错误的地方，或者因为行为是由 force.drag 控制的，我必须重新定义它来添加额外的行为我想要。

Answer 1

drag 事件不是由 circle 触发的，它是由拖动行为 ( source ) 触发的，调用 force.drag将返回该行为，您可以在那里设置一个监听器:

force.drag()
  .on("dragstart", function () {
    console.log(arguments);
  })

Demo , 查看控制台的输出

更新:

我 fork 了您发布的示例链接，它没有使用 d3.json 并且工作正常:demo