如何在 canvas 元素上绘制视频？
How to draw over video on a canvas element?
我正在尝试在我的应用程序中使用 canvas 来处理两件事。首先是在 canvas 上显示视频（我已经这样做了）。在那之后，我需要在这段视频上画方块，而正是在那部分我遇到了一些麻烦。当我尝试将一个 canvas 用于另一个时，视频始终停留在我正在创建的方块之上。如果我只使用一个 canvas，同样的事情也会发生。有人可以帮我吗？
对于 canvas，这完全取决于操作顺序，在您的示例中，您正在绘制视频并希望在顶部绘制正方形，因此您需要在 AFTER[=26= 之后绘制正方形] 你画视频
简单示例：
https://jsfiddle.net/a3z5hb45/
ctx.fillStyle = "red"
ctx.fillRect(x, y, 100, 100);
ctx.fillStyle = "blue"
ctx.fillRect(x + 50, y + 50, 100, 100);
在这里你看到红色在蓝色下面。想象一下，红色是你的视频，所以如果你画了一些东西，它就会出现在上面。
如果你颠倒顺序你会得到这个：
我正在尝试在我的应用程序中使用 canvas 来处理两件事。首先是在 canvas 上显示视频（我已经这样做了）。在那之后，我需要在这段视频上画方块，而正是在那部分我遇到了一些麻烦。当我尝试将一个 canvas 用于另一个时，视频始终停留在我正在创建的方块之上。如果我只使用一个 canvas，同样的事情也会发生。有人可以帮我吗？
对于 canvas，这完全取决于操作顺序，在您的示例中，您正在绘制视频并希望在顶部绘制正方形，因此您需要在 AFTER[=26= 之后绘制正方形] 你画视频
简单示例：
https://jsfiddle.net/a3z5hb45/
ctx.fillStyle = "red"
ctx.fillRect(x, y, 100, 100);
ctx.fillStyle = "blue"
ctx.fillRect(x + 50, y + 50, 100, 100);
在这里你看到红色在蓝色下面。想象一下，红色是你的视频，所以如果你画了一些东西，它就会出现在上面。
如果你颠倒顺序你会得到这个：