Javascript метод lineTo()

Метод lineTo() добавляет новую точку контура и создает линию к этой точке от последней заданной точки (этот метод не рисует линию).

Примечание: Чтобы в действительности нарисовать контур, используйте метод stroke().

JavaScript синтаксис:context.lineTo(x, y);

Значения параметров

ПараметрОписание
xКоордината X новой точки контура
yКоордината Y новой точки контура

Пример использования

Пример №1

Начнем создание контура, передвинемся в координаты 0,0. Создадим линию к координатам 300,150:

Ваш браузер не поддерживает HTML5 тег canvas.

JavaScript:


var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(300,150);
ctx.stroke();

Пример №2

Нарисуем фигуру, похожую формой на латинскую букву L:

Ваш браузер не поддерживает HTML5 тег canvas.

JavaScript:


var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.lineTo(20,100);
ctx.lineTo(70,100);
ctx.stroke();