HTML-canvas lineTo() Methode
Voorbeeld
Begin een pad, ga naar positie 0,0. Maak een lijn naar positie 300.150:
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:
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