Javascript 在html画布中显示图像，然后增大其大小

我想知道是否有可能使用各种线条和bez曲线创建一个图像，这些线条和曲线会在画布上出现，然后向下移动，并随着其增长而变大。所讨论的动画要求房间充满气体，因此气体在画布上移动时会变得越来越大

我曾考虑过只绘制图像，然后使用for循环将图像向下移动到某个y坐标，但这无助于增加创建图像的部分

---

感谢任何帮助

制作动画有不同的方法。我通常为我的画布游戏做的是，我有一个gameloop，它以我在项目开始时决定的特定FPS循环。每个动画通常由时间和速度控制

var fps = 60;
var lastUpdateTime = +new Date(); //when did I last update the game?

function gameloop() {
    var updateStartTime = +new Date();
    update(updateStartTime-lastUpdateTime); //update the game for the according to the elapsed time since last update
    lastUpdateTime = updateStartTime;

    //Normally I also handle spawning stuff here
    //I also remove old object in my gameloop

    setTimeout(gameloop,1000/fps)
}

function update(elapsedTime) {
    //This function update the locations of game elements such as player position, bullets, enemies, bananas etc. (or even gas clouds!)
    //When I change a value, I use the time-parameter passed along with the call so that I get a smooth game even though the browser might lag.
    playerX += velocity*timeElapsed; //as an example
}

这里有一个关于你的问题的例子，我创建了一个函数来创建一个气泡对象（是的，我知道使用气泡是多么错误）。这些物体向下移动（物理？！）并增大尺寸（好吧，这听起来越来越疯狂），看看：

---

这真是太酷了，谢谢。它给了我一个很好的想法，我可以如何去做这件事。关于动画，如何在某个“y坐标”处停止气泡。当气泡达到临界y坐标时，可以通过将其速度设置为0来停止气泡<代码>气泡[i]。速度=0在update（）函数的for循环中执行check（if语句）。非常好，我想我已经得到了我所需要的。如果我想在气泡在屏幕上移动的同时使用setInterval运行另一个动画，我可以将其作为一个单独的函数添加进来，并在gameloop（）中的某个地方调用它吗？我有一个男人会走路，最终会因为气体而摔倒，但是我用setInterval在这个男人的不同图像中循环，来模拟他的动作，但看起来不太合适。这听起来像是一个新问题，提交它，我很乐意帮你。Challanging在评论中这样做=）也许你的新问题的答案在这里：非常感谢，我发布了一个新问题：一如既往，感谢你的帮助