Methode lineTo

De methode lineTo trekt een lijn van punt naar punt. De lijn wordt getrokken vanaf de huidige positie van de tekenpen naar de opgegeven coördinaten. Coördinaten worden opgegeven als parameters van de methode.

Syntaxis

javascriptcontext.lineTo(x, y);

Voorbeeld

Laten we een lijn tekenen:

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(150, 50);
ctx.stroke();

Результат:

Voorbeeld

Laten we een vierkantje tekenen:

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(150, 50);
ctx.lineTo(150, 150);
ctx.lineTo(50, 150);
ctx.lineTo(50, 50);
ctx.stroke();

Результат:

Zie ook