如题，小弟做了一个canvas动画，模仿以前那种屏保常见的气泡，我想实现气泡与气泡之间的合理碰撞。请大大们给出一些思路，谢谢。
做了一些尝试。
在每一帧碰撞的时候去检测当前气泡与其他所有气泡的是否发生碰撞，如果是，就反转它们当前的运动方向。失败
demo传送门
横坐标二分检测相交，二分点特判，能实现O(nlogn)的检测吧；如果每次都两两对比复杂度就O(n^2)了
提供一个思路，
1.将场景切分成多个区域，比如四个矩形
2.每个区域维护一个数组cirs，数组内放的是在当前部分的圆的圆心坐标（即使坐标不在该区域内，而是部分圆在）
3.每个圆有一个区域列表areas，存放当前圆所在区域(列表的原因是，圆有可能会在区域交接处)
4.判断时，根据圆的区域列表areas，遍历区域列表cirs，判断所存在半径内有没有与该圆相交的圆，即是cirs里面的圆心x1,y1，半径r1与当前圆x,y，r是否满足 (x1 - x)^2 + (y1 - y)^2 <= (r1+r)^2。满足就是相撞
很多讲解HTML5 canvas开发的书籍都会讲到这个问题。
比如《HTML5 canvas 基础教程》这本书就有，在第7.2节有处理碰撞的方法。
这个……需要考虑物理学上的碰撞公式吧？