Линия
Линии рисуются через методы lineTo()
. Но при вызове данного метода, линия не отобразится, т.к. не задан стиль линии (цвет, толщина и другое). Чтобы показать линию без установки стилей, достаточно просто использовать метод stroke()
.
var canvas = document.querySelector('canvas') var ctx = canvas.getContext("2d"); ctx.moveTo(0, 0); ctx.lineTo(50, 50); // первая линия ctx.moveTo(60, 60); ctx.lineTo(100, 100); // вторая линия ctx.stroke();
Дополнительные свойства для линий:
ctx.lineWidth = 10; // толщина линии ctx.lineCap = "round"; // закруглённые линии ctx.lineCap = "butt"; // квадратные линии ctx.lineJoin = "miter"; // острые углы (по умолчанию) ctx.lineJoin = "round"; // закруглённые углы ctx.lineJoin = "bevel"; // тупые углы
Поддержать автора
Все статьи создаются и поддерживаются одним человеком,
если вам нравится контент, вы можете поддержать автора сайта