CanvasRenderingContext2D: метод moveTo()

Метод CanvasRenderingContext2D.moveTo() API Canvas 2D начинает новый подпуть в точке, заданной заданными координатами (x, y).

x

Координата по оси X (горизонтальная) точки.

y

Координата по оси Y (вертикальная) точки.

None (undefined).

В этом примере используется moveTo() для создания двух подпутей в рамках одного пути. Затем оба подпути отрисовываются с помощью одного вызова stroke().

HTML

<canvas id="canvas"></canvas>

JavaScript

Первая линия начинается в (50, 50) и заканчивается в (200, 50). Вторая линия начинается в (50, 90) и заканчивается в (280, 120).

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

ctx.beginPath();
ctx.moveTo(50, 50); // Begin first sub-path
ctx.lineTo(200, 50);
ctx.moveTo(50, 90); // Begin second sub-path
ctx.lineTo(280, 120);
ctx.stroke();

Результат

• Интерфейс, определяющий этот метод: CanvasRenderingContext2D
• CanvasRenderingContext2D.lineTo()
• CanvasRenderingContext2D.stroke()