p5.js创意绘图(1)动态图形

利用p5.js临摹一幅动态图形。
原图

分析
看起来像是两个葫芦在转圈，其实每个圆点并没有旋转，只是在以图形中心为原点的射线上来回移动。长瘦葫芦上的圆点移动的周期是短胖葫芦上的圆点移动的周期的两倍，且长瘦葫芦上的圆点的初相位与短胖葫芦上的圆点的初相位相差PI。
因此其实就是每个圆点与图形中心距离按正弦函数随时间发生变化，且每个圆点的初相位与其极坐标下（以图形中心为原点）的角度有关。
(△t:时间变量；△θ,:角度变量；max:与图形中心最大距离；min:与图形中心最小距离）
短胖葫芦上的圆点：r1=sin(△t+3/2.0×PI+△θ×2)×(max1-min1)+min1;
长瘦葫芦上的圆点：r2=sin(△t+1/2.0×PI+△θ×2)×(max2-min2)+min2;
(因为每圈圆点拼成的图形（葫芦）有两个头，所以△θ要乘2。)
再利用极坐标与直角坐标的关系：x=rcosθ,y=rsinθ，可计算出每个圆点的直角坐标。
画图
由上述分析可得代码：
先设全局变量rt作为时间变量

var rt=0

再在draw()函数内

    dt=0;
    for(i=1;i<=num;i++)//num为一圈上圆点个数
    {
   
	  	r1=sin(rt+3/2.0*