HTML canvas miterLimit
Attribute
Example
Draw a line with a maximum miter length of 5:
JavaScript:
Browser Support
Internet Explorer 9, Firefox, Opera, Chrome, and Safari support the miterLimit property.
Note: Internet Explorer 8 and earlier versions do not support the <canvas>
element.
Definition and Usage
The miterLimit property sets or returns the maximum miter length.
The miter length is the distance between the inner corner and the outer corner where two lines meet.
Tip: The miterLimit property is effective only when the lineJoin property is set to "miter".
The smaller the angle of the corner, the larger the miter length.
To avoid an excessively long miter length, we can use the miterLimit property.
If the miter length exceeds the value of miterLimit, the corner will be displayed using the "bevel" type of lineJoin (Fig 3):
Default value: | 10 |
---|---|
JavaScript syntax: | context.miterLimit = number; |
--- | --- |
Property Values
Value | Description |
---|---|
number | A positive number. Specifies the maximum miter length. If the miter length exceeds the value of miterLimit, the corner will be displayed using the "bevel" type of lineJoin. |