javascript - 当我想创建圆形时，为什么我的 Canvas 会创建椭圆？

Question

每次我尝试用这种方法画一个圆(其中 board 是具有 2d 上下文的 Canvas 板):

        board.lineWidth = 4;
        board.beginPath();
        board.arc(canvas.width/2, canvas.height/2, 10,0,360);
        board.strokeStyle = "blue";
        board.stroke();
        board.closePath();

它总是创建更多的椭圆而不是圆形，并且它从不遵循我给它的坐标。如果我说 canvas.width/2 和高度(使其居中)，它甚至会超出 Canvas 本身。当我给它其他值(例如 30)时，它也比 30 像素远得多。

旁注:我的 Canvas 的宽度和高度都是 500 像素。

Answer 1

arc的第5个参数预计是以弧度为单位的 Angular ，而不是度数。

360 度 = 2 * PI

所以你必须将代码更改为:

...
board.arc(canvas.width/2, canvas.height/2, 10, 0, Math.PI * 2);