Javascript 如何使相邻的圆随着一组圆中一个圆半径的增加而移动？

我正在制作一个布局，其中包含几个在一个页面上组合在一起的圆圈。单击圆时，其半径将增大。我遇到的问题是，当单击其中一个圆时，相邻的圆不会被推到一边。相邻的圆将与单击的圆重叠（因为它现在具有更大的半径）。就好像周围的圆还记得它原来的半径，而不是新的半径。以下是我到目前为止的情况：

<g id="bubble-nodes">
<rect id="bubble-background"></rect>
<a class="class="bubble-node">
    <circle r="65"></circle>
</a>
....
</g>

var circle = d3
.selectAll('circle')
.on('click', function (d) {
    d3.select(this).attr("r", 85);
});

您需要使用更改的半径重新运行布局算法。我该怎么做？我还是d3.js的新手。无论你做了什么来计算圆的位置，你都需要再做一次。