Javascript 拖动多个非'；t分组在'g'标记中？

我使用D3在带有

circleGroup.call（force.drag）

的强制布局中拖动圆形元素，其中

force.drag

是一种拖动行为，

circleGroup

是所有圆形元素的选择。这适用于拖动单个图元

如何一次拖动多个圆形元素的任意选择

请注意，因为选择必须是任意的，所以我不认为我可以将要拖动到一起的对象组合在一个

标记中

我已经看过了，但仍然无法让它工作

---

---

你可以这样做。。。这不是一个强制布局，但您应该能够非常轻松地将其扩展到该布局

单击一个圆以将其选中，然后单击并拖动到其他位置以使其四处移动

基本上，我会跟踪数组中所选圆的索引，并在

drag

处理程序中更新相应的数据。数据更新后，我修改所选圆圈的

cx

和

cy

属性

注意：

drag

处理程序连接到一个透明的

rect

，它覆盖了整个SVG，我使用CSS样式将事件与

指针事件：all正确地级联到相应的SVG元素应用于
rect


var宽度=500，
高度=500；
var数据=d3.范围（10）.映射（函数（d）{
返回{
x:parseInt（Math.random（）*宽度），
y:parseInt（Math.random（）*高度），
r:parseInt（Math.random（）*10+10）
}
});
var selectedNodes=[]，
selectedData=[]；
var drag=d3.behavior.drag（）
.打开（“拖动”，拖动）
var-vis=d3.选择（“vis”）.追加（“svg”）
.attr（“宽度”，宽度）
.attr（“高度”，高度）；
var dragRect=vis.append（“rect”）
.attr（“类”、“拖动”）
.attr（“宽度”，宽度）
.attr（“高度”，高度）
.呼叫（拖动）；
var nodes=vis.selectAll（“circle.node”）
.数据（数据）
.enter（）.append（“圆”）
.attr（“类”、“节点”）
.attr（“r”，函数（d）{
返回d.r；
})
.attr（“cx”，功能（d）{
返回d.x；
})
.attr（“cy”，函数（d）{
返回d.y；
})
。开启（“点击”，点击）；
函数（d）{
selectedData.forEach（函数（i）{
数据[i].x+=d3.event.dx；
数据[i].y+=d3.event.dy；
});
d3.selectAll（“圆圈、节点、选定”）
.attr（“cx”，功能（d）{
返回d.x；
})
.attr（“cy”，函数（d）{
返回d.y；
});
}
单击函数（d，i）{
var j=选定的数据索引（i）；
如果（j==-1）{
选择数据推送（i）；
d3.选择（此）.classed（“已选择”，真）；
}否则{
选择数据拼接（j，1）；
d3.选择（此）.classed（“选择”，false）；
}
}
rect.drag{
填充：无；
指针事件：全部；
}
圆节点{
填写：#000；
}
圆。节点：悬停{
光标：指针；
}
circle.node.selected{
填充：#f00；
}