Javascript和Canvas - 动画正弦波

Question

所以，我有以下代码来动画一些东西...它非常基本......

SetInterval(function() {
   particlesY -= 1;
}, 10);

然后循环：

ctx.clearRect(0,0,canvas.width,canvas.height);
ctx.drawRect(50, particlesY, 32, 32);

这样可以正常工作，但我想要一些X轴变化 - 我可以使用Math.random()来获得随机方向，但结果非常生涩且非常可笑。

我认为正弦波会给我一个很好的平滑X轴变化。

有什么想法吗？ ：（

Answer 1

正弦波应该相当简单：

ctx.drawRect( Math.sin(particlesY) * 100, particlesY, 32, 32);