# miterLimit property

The `miterLimit` property controls the sharpness of joining two lines when the `lineJoin` property is set to `miter`. How it controls: if the length of the corner is greater than the number specified in `miterLimit`, then the line join behaves as if `lineJoin` is set to `bevel`.

By default, `miterLimit` is `10`. Less than `1` its value cannot be set.

## Syntax

`context.lineJoin = 'miter', 'round' or 'bevel';`

## Example

Now the `lineJoin` property is set to `miter`, but so far there are no restrictions, the angle is acute:

`<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>` `let canvas = document.querySelector('#canvas'); let ctx = canvas.getContext('2d'); ctx.beginPath(); ctx.lineWidth = 10; ctx.moveTo(50, 140); ctx.lineTo(100, 30); ctx.lineTo(150, 140); ctx.stroke();`

:

## Example

And now set the limit with `miterLimit`:

`<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>` `let canvas = document.querySelector('#canvas'); let ctx = canvas.getContext('2d'); ctx.beginPath(); ctx.lineWidth = 10; ctx.miterLimit = 1; ctx.moveTo(50, 140); ctx.lineTo(100, 30); ctx.lineTo(150, 140); ctx.stroke();`

:

## See also

- the `lineCap` property
  that defines the type of a line end

← →
↑
en ru