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