# Свойство miterLimit

Свойство `miterLimit` регулирует остроту соединения двух линий в том случае, когда свойство `lineJoin` задано в значение `miter`. Как регулирует: если длина угла получается больше, чем число, заданное в `miterLimit`, то соединение линий ведет себя так, будто `lineJoin` задан в значение `bevel`.

По умолчанию `miterLimit` имеет значение `10`. Менее `1` его значение установить нельзя.

## Синтаксис

`контекст.lineJoin = 'miter' или 'round' или 'bevel';`

## Пример

Сейчас свойство `lineJoin` установлено в значение `miter`, но пока никаких ограничений не стоит, угол острый:

`<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();`

:

## Пример

А теперь установим ограничение с помощью `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();`

:

## Смотрите также

- свойство `lineCap`,
  которое задает вид конца линии

←→
↑
en ru