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);