如何在 d3.js 强制有向图中检测元素拖动

Question

我在 d3.js 中有一个力有向图（非常棒：对 MB 和所有相关人员表示敬意！）。我希望能够以某种方式检测并返回当前被拖动的任何节点的索引。

我知道我可以重新定义 d3.behavior.drag() 以将回调附加到拖动事件，但我想要原生 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，查看控制台输出

更新：

我分叉了您发布的示例链接，它不使用d3.json，它工作正常：demo