Canvas lineTo() metod
Definition och användning
lineTo() metoden för att lägga till en ny punkt och skapa en linje från denna punkt till den senast angivna punkten på canvas (denna metod skapar inte en linje).
Tips:Använd stroke() Metoden ritar en exakt väg på canvas.
Exempel
Exempel 1
Börja en väg, flytta till position 0,0. Skapa en linje som når positionen 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();
Tips:Mer exempel tillgängligt på sidans botten.
Syntax
context.lineTo(x,y);
Parametervärde
| Parameter | Beskrivning |
|---|---|
| x | X-koordinaten för målpunkten för vägen. |
| y | Y-koordinaten för målpunkten för vägen. |
Mer exempel
Exempel 2
Rita en väg, formen är bokstaven 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();
Webbläsarstöd
Numrerna i tabellen anger den första webbläsarversionen som helt stöder detta egenskap.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Kommentar:Internet Explorer 8 och äldre versioner stöder inte <canvas>-elementet.
