Перейти к содержанию

lineTo()

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

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

Синтаксис

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()

Ссылки