如何改变圆的半径但保持模式？

Question

我在网上找到了一些代码来围绕中心圆绘制圆圈。如何在不影响布局的情况下更改较小圆圈的半径（目前所有圆圈都在移动并且不再以大圆圈为中心）。当我更改 css 文件中的半径（宽度和高度）时会发生这种情况。改变大圆半径也会导致整组圆向右或向左移动（尽管它们保持对称）。这是我的代码：var div = 360 / 6;var radius = 150;var parentdiv = document.getElementById('parentdiv');var offsetToParentCenter = parseInt(parentdiv.offsetWidth / 2); //assumes parent is squarevar offsetToChildCenter = 20;var totalOffset = offsetToParentCenter - offsetToChildCenter;for (var i = 1; i <= 6; ++i) {  var childdiv = document.createElement('div');  childdiv.className = 'div2';  childdiv.style.position = 'absolute';  var y = Math.sin((div * i) * (Math.PI / 180)) * radius;  var x = Math.cos((div * i) * (Math.PI / 180)) * radius;  childdiv.style.top = (y + totalOffset).toString() + "px";  childdiv.style.left = (x + totalOffset).toString() + "px";  parentdiv.appendChild(childdiv);}#parentdiv {  position: relative;  width: 150px;  height: 150px;  background-color: red;  border-radius: 150px;  margin: 150px;}.div2 {  position: absolute;  width: 40px;  height: 40px;  background-color: red;  border-radius: 100px;}<div id="parentdiv"></div>我也想将圆圈移动到屏幕的中心，但我不确定如何。我对 html/css/js 很陌生，任何帮助将不胜感激！