Как нарисовать пунктирную линию на Canvas?

@jorge 

Для рисования пунктирных линий на объекте Canvas в JavaScript можно использовать метод setLineDash() контекста рисования.

Ниже приведен пример кода, который рисует пунктирную горизонтальную линию на Canvas:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");

// Установить массив длин и промежутков для пунктирной линии
ctx.setLineDash([10, 5]);

// Нарисовать линию
ctx.beginPath();
ctx.moveTo(0, 50);
ctx.lineTo(200, 50);
ctx.stroke();

В данном примере мы установили массив [10, 5] для метода setLineDash(). Этот массив означает, что линия будет состоять из базовой длины 10 и промежутка длиной 5.

Также, чтобы линия выглядела прерывистой, необходимо вызвать метод setLineDash() перед каждой нарисованной линией.