Javascript 重置d3 forceSimulation中的所有隔离力

我试图创建一个在几个州之间转换的群图，但遇到了一些障碍。我发现最好的设置方法是将我的节点聚集在中心，然后基于我的数据。然而，我发现，一旦我做到了这一点，就不可能“重置”整个群集并将每个节点带回中心。似乎每个节点都开始相对于最后一个孤立的力移动，即使我添加了力中心

诚然，我是d3部队的新手，所以这可能是一个愚蠢的问题，但我做了很多搜索，但没有找到答案

var宽度=400；
var高度=150；
var半径=3；
风险值数据=[
{“id”：1，“a”：1，“b”：1，“color”：“#ff0000”}，
{“id”：2，“a”：1，“b”：2，“color”：“#ff0000”}，
{“id”：3，“a”：2，“b”：1，“color”：“#00ff00”}，
{“id”：4，“a”：2，“b”：2，“color”：“#00ff00”}，
{“id”：5，“a”：3，“b”：1，“color”：“#0000ff”}，
{“id”：6，“a”：3，“b”：2，“color”：“#0000ff”}，
];
$（文档）.ready（函数（）{
createGraph（）；
makeForce（）；
});
var-svg；
函数createGraph（）{
svg=d3。选择（“主体”）
.append（“svg”）
.attr（“宽度”，宽度）
.attr（“高度”，高度）
.style（“背景色”）、“#dddddd”）；
}
var模拟；
函数makeForce（）{
var节点=数据；
node=svg.append（“g”）.attr（“stroke”）和“bbb”）.attr（“stroke width”和.5）。选择all（“node”）；
var attractForce=d3.forceManyBody（）.强度（20）.距离最大值（40）.距离最小值（60）；
var repelForce=d3.forceManyBody（）.强度（-10）.距离最大值（50）.距离最小值（10）；
模拟=d3。力模拟（节点）
.α衰变（0.03）
//.力（“吸引力”，吸引力）
.力（“排斥力”，排斥力）
.力（“x”，d3.力x（宽度/2））
.力（“y”，d3.力（高度/2））
.force（'碰撞'，d3.forceCollide（）.radius（函数d）{
返回（半径+2）；
}))
//.alphaTarget（.1）
。在（勾选）上；
重新启动（0）；
功能重新启动（拆分）{
如果（拆分==0）{
node=node.data（节点，函数（d）{return d.id；}）；
node.exit（）.remove（）；
node=node.enter（）.append（“circle”）.attr（“fill”，函数（d）{return d.color；}）.attr（“r”，radius）.merge（节点）；
模拟。节点（节点）；
simulation.alpha（1.restart（）；
}否则如果（拆分==1）{
d3.选择（“#注释”）.html（“点拆分”）；
node=node.data（节点，函数（d）{return d.id；}）；
node.exit（）.remove（）；
node=node.enter（）.append（“circle”）.attr（“fill”，函数（d）{return d.color；}）.attr（“r”，radius）.merge（节点）；
//更新并重新启动模拟。
模拟。节点（节点）；
模拟力（“y”，d3.力（高度/2））
.力（“A”），隔离（d3.力（宽度），功能（d）{
回报率（d.b==2）；
}))
.力（“B”），隔离（d3.力（0），功能（d）{
回报率（d.b==1）；
}))
。在（勾选）上；
//simulation.alpha（1.restart（）；
}否则如果（拆分==2）{
d3.选择（“svg”）.样式（“背景色”，“ffffdd”）；
d3.选择（“#comments”）.html（“这里什么也没发生，但我想清除点上的所有力，让它们回到中心”）；
node=node.data（节点，函数（d）{return d.id；}）；
node.exit（）.remove（）；
node=node.enter（）.append（“circle”）.attr（“fill”，函数（d）{return d.color；}）.attr（“r”，radius）.merge（节点）；
//更新并重新启动模拟。
模拟。节点（节点）；
模拟力（“x”，d3.力x（宽度/2））
.力（“y”，d3.力（宽度/2））
。在（勾选）上；
//simulation.alpha（1.restart（）；
}
功能隔离（强制、过滤器）{
var initialize=force.initialize；
force.initialize=function（）{initialize.call（force，nodes.filter（filter））；}；
返回力；
}
}
setTimeout（函数（）{
重启（1）；
}, 1000);
setTimeout（函数（）{
重启（2）；
}, 4000);
函数勾选（）{
attr（“cx”，函数（d）{return d.x；}）
.attr（“cy”，函数（d）{返回d.y；}）
}
}

加载点

请记住，在模拟上注册的力将保持附着状态，直到您通过将其设置为

null将其移除：

模拟。力（名称[，力]）

[……]

要移除具有给定名称的力，请传递null作为力

只要名称不同，仅仅添加新部队不会影响任何先前添加的部队。要操纵已附加到模拟的力，需要使用相同的名称重新注册该力/其克隆/新力。同样，要取消注册力，请将其设置为
null

要移除隔离力
“A”
和
“B”
，您需要执行以下操作：

simulation
  .force("A", null)
  .force("B", null);

这也回答了您的第二个问题，为什么使用值为
0
和
width
的
d3.forceX
将不会在边界上定位圆。在添加新的隔离力
“A”
和
“B”
时，所有先前登记的力，即
“排斥力”
、
“x”
、
“y”
和
“碰撞”
，仍将应用。正是这六种力的组合决定了第二步中圆的位置

请看下面的工作演示：


var宽度=400；
var高度=150；
var半径=3；
风险值数据=[
{“id”：1，“a”：1，“b”：1，“color”：“#ff0000”}，
{“id”：2，“a”：1，“b”：2，“color”：“#ff0000”}，
{“id”：3，“a”：2，“b”：1，“color”：“#00ff00”}，
{“id”：4，“a”：2，“b”：2，“color”：“#00ff00”}，
{“id”：5，“a”：3，