如何填充画布以外的画布

Question

我想用黑色填充画布。我用下面的代码来填充画布。

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.fillStyle='rgba(0,0,0,0.1)';
ctx.fillRect(0,0,c.width,c.height);

我需要在画布上绘制一个圆圈。我用下面的代码绘制了一个圆圈。

ctx.lineWidth = 10;
ctx.strokeStyle='red';
ctx.arc(150,75,50,0,2*Math.PI,false);
ctx.stroke();

我在canvas元素下面有一个视频标签。我想通过圈子显示视频。我不想填充圈子，因为如果我们填充圈子，我们无法显示视频。除了圈子我想填补。我将透明色填充到圆圈但是没有显示视频。它显示填充到画布的颜色。

我的要求是我必须通过圈子显示视频。

请帮助我如何实现这一目标。

Answer 1

只需将ctx.stroke()更改为ctx.fill()，有关详细信息，请参阅此页：https://www.w3schools.com/tags/canvas_fill.asp