两组交集（HTML5中的SVG或画布）

Question

我想绘制两个交集的重叠（或不重叠）两个具有相同半径的圆。

例如，基于以下输入数据：

• intersection = 1 ，
• circle1 = 0 ，
• circle2 = 3

我会得到： http://img406.imageshack.us/img406/7813/53261474.jpg

如果我的输入数据是：

• intersection = 59 ，
• circle1 = 0 ，
• circle2 = 0

我会得到：http://img713.imageshack.us/img713/319/95092557.png

我怎样才能做到这一点？我应该使用SVG还是画布？当文档准备好时，是否可以在加载时应用这些球的一些动画（例如，在它们的相交/差异区域内可能有一些随机移动）。理想情况下我会使用jQuery。

谢谢你的亲戚！