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

@keyon.brown 

Для рисования простой линии на Canvas используется метод lineTo() объекта context. Например, чтобы нарисовать линию с координатами (x1, y1) и (x2, y2), нужно выполнить следующий код:

1
2
3
4
5
6
7

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

context.beginPath();
context.moveTo(x1, y1);
context.lineTo(x2, y2);
context.stroke();

beginPath() используется для начала нового пути. moveTo(x1, y1) устанавливает начальную точку пути в координатах (x1, y1). lineTo(x2, y2) рисует линию от текущей точки пути до точки с координатами (x2, y2). Метод stroke() рисует линию на холсте.