Javascript 如何在两个圆之间的任意位置画圆？

我有两个圆圈。一个半径为150，另一个半径为350。我想在半径为150-350的空间中放置一些圆。它不应该过度放置（覆盖）在已经放置的其他圆上。应该在每次刷新时随机放置它。有人能告诉我如何在画布上做到这一点的想法/逻辑吗。Javascript

[编辑]

所有圆的半径都是预定义的

至于绘制实际图像，这取决于您，但以下是放置圆的方式：

首先，在0°和360°之间随机选择一个Θ

然后为你的小圆选择一个半径

r1

，介于0和50之间（100像素“轨迹”宽度的一半）

然后在150+

r1

和350-

r1

之间选择一个中心位置

r2

现在在（Θ，

r2

）中给出的位置绘制一个圆半径

r1

。

演示：

这里的诀窍是创建随机圆，但也要确保它们不会与以前创建的圆重叠

以下是注释代码：

function randomCircle(){

    // define random radius

    var radius=minCircle+Math.random()*(maxCircle-minCircle);

    // define random distance between inner/outer rings

    var distFromCenter=innerRadius+radius+Math.random()*(outerRadius-innerRadius-radius*2);

    // define random angle

    var angle=Math.random()*PI2;

    // calculate the x,y of the defined circle

    var x=cx+distFromCenter*Math.cos(angle);
    var y=cy+distFromCenter*Math.sin(angle);

    // check this new circle versus all previous random circles for a collision 

    var hit=false;
    for(var i=0;i<randomCircles.length;i++){
        var circle=randomCircles[i];
        var dx=circle.cx-x;
        var dy=circle.cy-y;
        var r=circle.radius+radius;
        if(dx*dx+dy*dy<=r*r){
            hit=true;
        }
    }

    // if no collision occurred, add this new circle to the existing circles array

    if(!hit){
        var color=randomColor();
        randomCircles.push({cx:x,cy:y,radius:radius,color:color}); 
    }

}

函数randomCircle（）{
//定义随机半径
var radius=minCircle+Math.random（）*（maxCircle-minCircle）；
//定义内圈/外圈之间的随机距离
var distFromCenter=innerRadius+radius+Math.random（）*（outerRadius-innerRadius-radius*2）；
//定义随机角度
var angle=Math.random（）*PI2；
//计算定义圆的x，y
var x=cx+distFromCenter*Math.cos（角度）；
变量y=cy+distFromCenter*Math.sin（角度）；
//检查此新圆与所有以前的随机圆是否存在碰撞
var-hit=false；
for（var i=0；iA）是您想要的圆数1）固定2）最小值和最大值之间的随机3）完全随机（1到最大值）？B）我猜对于圆的半径，随机性在一个范围内（例如：20到50半径之间）是吗？A）3）完全随机，可以放置最大可能的圆。B）是的，在20-50范围内。我正在调查。如果需要任何东西，我会更新你。极坐标需要查看。你能在这里解释如何应用极坐标吗？你能给我一些伪代码吗。谢谢，