我正在使用 D3 Drag 在画布周围拖动一些圆圈。然后我让它们固定位置。但是，我希望将它们与我创建的另一个 svg 元素保持一定距离：
node.attr("transform", function(d,i) { return "translate ("+ arc[i].centroid() +")" +"translate("+d.x+","+d.y+")"; })
拖动时，圆圈不会拖动，直到多次单击鼠标并且通常远离实际的鼠标手。
我知道我可以摆脱质心，但想知道解决这个问题的方法。
您在第一次拖动尝试时获得的跳跃是由于第 57 行的翻译与更下方的翻译不匹配。为了避免跳转，使第 57 行和第 76 行匹配。将 57 更改为：
d3.select(this).attr("transform", "translate ("+ arc[i].centroid() +")" +"translate("+d.x+","+d.y+")");
为了让它工作，我必须在第 52 行将 d 和 i 作为参数传递：
.on("drag", function(d, i) {
工作小提琴：http: //jsfiddle.net/Zc4z9/11/