javascript - 在绘制矩形之前更改 lineCap 和 lineJoin 没有任何作用？

Question

我有这个代码：

context.lineWidth = 10;

context.lineCap = "square";
context.lineJoin = "square";

context.strokeRect(x, y, w, h);

lineWidth似乎工作得很好，但正在改变lineCap并且lineJoin没有做任何事情。lineCap当我将and设置lineJoin为时，矩形仍然是圆角的"round"。有人知道为什么是这样吗？

Answer 1

这是因为您需要使用miterfor lineJoinsincesquare不是有效值。

现场演示

lineJoin 属性定义了 UA 将放置在两条线相交处的角的类型。三个有效值是斜角、圆角和斜角。

W3 参考

此外，如果您只是在做 rects，则不需要lineCap