一次偶然的機會，設計師出了這樣一張圖：
在區(qū)域內(nèi)，小圓形隨機分布。
一般來講，在區(qū)域內(nèi)生成一個{x,y}對象并不復雜，這里的難點是碰撞檢測。
先來了解一下調(diào)用方式：
參數(shù)1是隨機一個位置后，調(diào)用的回調(diào)，這里會傳出來{x,y,size},size可以忽略，沒什么用。
參數(shù)2是告訴位置組件，圓的個數(shù)（也就是位置的個數(shù)）和小圓半徑size（和回傳的size是一個字段）。
參數(shù)三是整體區(qū)域的半徑。
細心的同學會問：為啥都是傳的半徑呢？配置是什么樣子的呢？getSpotPos怎么接受返回的位置呢？
我們先來看下配置的樣子（getConfig函數(shù)里做了什么）：
PS:想要幾個位置就傳幾個尺寸，簡單的令人發(fā)指有木有。。。
再來看下getSpotPos如何接受返回值的：
大家一定會有疑問：這里為什么是10次的時候重新渲染？ 小編：因為配置里有10個尺寸信息啊～.～（這里其實可以抽象成一個變量）。
好了，用法就是上邊這么用了，傳說中的隨機位置和碰撞呢？
表糟急，代碼這就來。
80行代碼，童叟無欺。
大概思想：在大圓范圍（實例中，這10個元素的情況下，范圍半徑小于150，計算將會很吃力，所以保證范圍不會小于150）中間，生成第一個位置，也是最大的元素所在的位置。然后，其他的位置隨機生成后，與生成過的位置進行碰撞檢測，無碰撞就記錄，有碰撞，再生成。
碰撞中主要做的事情：保證不太靠邊，保證不會和大圓圓心離得太近，然后就是兩個位置x和y相等的情況（概率事件，不得不防）。最后是一般情況。
因為都是圓，所以只需檢測圓心距離是否大于兩半徑與最小間距之和就可以了。
做完之后，小編發(fā)現(xiàn)－－－－數(shù)學很重要啊。
