这篇文章给大家分享的是有关js怎么实现固定区域内的不重叠随机圆的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。
创新互联是专业的灵川网站建设公司，灵川接单;提供网站建设、网站设计,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行灵川网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!
最近公司有一个需求就是在一个固定的区域（500X500）内显示10个圆，且半径固定，而且不重叠
因为圆的个数固定，而且半径固定，那么就有可能会没有解决方案。
不过其实也没有很难，处理好半径的最大值就好了。
效果图：
思路：
（固定半径）
step1：先在区域内生成一个随机的圆心坐标，
step2：然后拿一个固定半径（从大到小拿固定半径）
step3：判断圆心和半径是否合法（是否超边距，或者两个圆相交）
step4：如果不合法，重新执行step2和step3
step5：如果合法，记为一个新圆
step6：重复step1~5，直到生成10个圆
（随机半径）
step1：先在区域内生成一个随机的圆心坐标，
step2：根据圆心坐标，与其他圆比较，获取最短的圆心距减去比较圆的半径（圆心距-R n RnR_n）的值，作为新圆的半径(这样就会生成一个相切的圆)
step3：判断圆心和半径是否合法（是否超边距）
step4：如果不合法，重新执行step2和step3
step5：如果合法，记为一个新圆
step6：重复step1~5，直到生成10个圆
代码：
// 参数
let obj = {
id: string, // canvas 的id
fix：boolean, // 是否固定半径，默认为false
minMargin： Number, // 两个圆的最短距离，默认为10
minRadius: Number, 最小的圆半径，默认为30
radiuArr: Array, 圆的半径的数组，当fix为true时该值必须填
total: Number ，圆的个数，默认为10
}
