HTML canvas miterLimit 属性

定义和用法

miterLimit 属性设置或返回最大斜接长度。

斜接长度指的是在两条线交汇处内角和外角之间的距离。

提示:只有当 lineJoin 属性为 "miter" 时,miterLimit 才有效。

边角的角度越小,斜接长度就会越大。

为了避免斜接长度过长,我们可以使用 miterLimit 属性。

如果斜接长度超过 miterLimit 的值,边角会以 lineJoin 的 "bevel" 类型来显示(图解 3):

实例

以最大斜接长度 5 绘制线条:

Your browser does not support the canvas tag.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.lineWidth=10;
ctx.lineJoin="miter";
ctx.miterLimit=5;
ctx.moveTo(20,20);
ctx.lineTo(50,27);
ctx.lineTo(20,34);
ctx.stroke();

Try it yourself

Syntax

context.miterLimit=number;

Attribute Value

Value Description
number

Positive number. Specifies the maximum miter length.

If the miter length exceeds the value of miterLimit, the corner will be displayed with the lineJoin type "bevel".

Technical Details

Default Value: 10

Browser Support

ຈຳນວນໃນຕາລະບັນພິຈາລະນາວ່າເກົ່າທີ່ສຸດທີ່ສະໜັບສະໜູນປະສົມອາຊິບນັ້ນ.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

ໝາຍ:Internet Explorer 8 ແລະການສະໜອງຫຼັງຈາກນັ້ນບໍ່ສະໜັບສະໜູນ <canvas> element.