我试图了解为什么我的圆圈不在HTML 5中Canvas的中间。我试图在画布的中间创建一个圆圈。
画布如下：
帆布：宽度：600高度：300
然后用以下代码绘制一个圆：
context.beginPath();
context.fillStyle = '#424';
context.arc(300, 150, 10, 0, 2*Math.PI, false);
context.fill();
context.closePath();
该圆圈绘制在右下角。
现在，如果我将（x，y）更改为（150，75），那么它将显示在中间。
我只是希望有人可以阐明为什么原始代码不起作用。
您没有显示如何设置画布的实际宽度和高度，但是如果中心点始终为150、75，则画布始终为默认大小，这意味着您可能使用CSS而不是直接在画布上设置大小。元件。
尝试这样的事情：
<canvas id="myCanvas" width=600 height=300></canvas>
在JavaScript中：
canvas.width = 600; // don't use canvas.style.*
canvas.height = 300;
您还可以通过这种方式为圆弧设置中心（以使其自动采用中心）：
context.arc(context.canvas.width * 0.5, context.canvas.height * 0.5,
10, 0, 2*Math.PI, false);
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句