用canvas绘制小圆在大圆内部转动

今天上dribbble, 可能需要fan, 看到一个很有趣的图像动画, 于是写了一个简单版的实现

image_processing20200712-11801-7pgu1f.gif

大致思路

  1. 小圆绕大圆转, 小圆的半径是大圆半径的一半
  2. 小圆的圆心在以大圆圆心为圆心, 小圆半径为半径的圆上不断移动
  3. 计算出小圆与各条直线的交点(难点), 注意一般会得出两个交点, 需要经过判断选择其中一个交点并绘制出来

你可能感兴趣的:(用canvas绘制小圆在大圆内部转动)