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

Пользователь

от keyon.brown , в категории: Другие , 8 месяцев назад

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

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от autumn_parker , 8 месяцев назад

@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() рисует линию на холсте.