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