HTML-canvas lineTo() Methode

❮ HTML Canvas-referentie

Voorbeeld

Begin een pad, ga naar positie 0,0. Maak een lijn naar positie 300.150:

Uw browser ondersteunt de HTML5canvastag niet.

javascript:

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

Browserondersteuning

De getallen in de tabel geven de eerste browserversie aan die de methode volledig ondersteunt.

Method
lineTo() Yes 9.0 Yes Yes Yes

Definitie en gebruik

De methode lineTo() voegt een nieuw punt toe en maakt een lijn NAAR dat punt VANAF het laatst opgegeven punt in het canvas (deze methode tekent de lijn niet).

Tip: gebruik de methode stroke() om het pad daadwerkelijk op het canvas te tekenen.

JavaScript-syntaxis: context .lineTo( x,y );

Parameterwaarden

Parameter Description Play it
x The x-coordinate of where to create the line to
y The y-coordinate of where to create the line to

Meer voorbeelden

Voorbeeld

Teken een pad in de vorm van de letter L:

Uw browser ondersteunt de HTMLcanvastag niet.

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


❮ HTML Canvas-referentie