html5裁剪画布上绘制的图像

我试图在一个画布游戏中画一个计时器，使用一个我想从顶部裁剪的图像来显示时间倒数

我知道我需要使用这个：

          ctx.drawImage(img, sx, sy, sw, sh, dx, dy, dw, dh);

但我就是想不起来，我一直在看一些网站，但他们的解释似乎不适合我

下面的排序用于降低高度，因为我有一个变量倒计时来降低高度，我只需要使用它来裁剪高度，而不是降低高度：

            ctx.drawImage(img,0,0,80,heightVar);

---

谁能告诉我如何在0,0处绘制这幅图像，它的宽度是80px，高度是480px？

如果我理解正确，你会想这样做：

ctx.drawImage(img, 0, 480 - heightVar, 80, heightVar,
                   0, 480 - heightVar, 80, heightVar);

这将使图像在仪表满时显示为0，0（heightVar=480），并随着heightVar的增加从上到下进行裁剪。我希望这对你有帮助

---

您还需要确保heightVar保持在（0-480）间隔内。否则，可能会出现鬼魂。

谢谢你的回复，自从你发帖以来，我一直在摆弄它。它不适合我。改变周围的事物，我可以让它从顶部或底部生长。有什么想法吗？我一定是误解了你想让计时器工作的方式。这不是你想要的吗？对它进行了一次快速测试，它按照我的预期工作。你的意思是它如何工作？我只是让“heightVar”被时间调制，以说明它如何寻找不同的值。这正是我想要的。谢谢你给我举个例子，很明显我在做傻事。没问题。如果你需要更多的帮助，请告诉我。