Μέθοδος Canvas lineTo()

Παρατηρητήριο Canvas

Ορισμός και χρήση

lineTo() Μέθοδος για να προσθέσετε έναν νέο σημείο και να δημιουργήσετε μια γραμμή από αυτό το σημείο μέχρι την τελευταία καθορισμένη θέση στο καanvas (η μέθοδος αυτή δεν δημιουργεί γραμμή).

Συμβουλή:Χρησιμοποιήστε stroke() Ο τρόπος που η μέθοδος διαγράμμιζει ακριβή διαδρομές στο καanvas.

Επίδειξη

Παράδειγμα 1

Ξεκινήστε μια διαδρομή, μετακινήστε σε θέση 0,0. Δημιουργήστε μια γραμμή που φτάνει στη θέση 300,150:

Ο φυλακτό σας δεν υποστηρίζει την ετικέτα HTML5 canvas.

JavaScript:

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

Δοκιμάστε το προσωπικά

Συμβουλή:Περισσότερα παραδείγματα σελίδας 底部.

Γλώσσα

context.lineTo(x,y);

Παράμετρος τιμή

Παράμετρος Περιγραφή
x Η συντεταγμένη x του στόχου της διαδρομής.
y Η συντεταγμένη y του στόχου της διαδρομής.

Περισσότερα παραδείγματα

Παράδειγμα 2

Δημιουργία μιας διαδρομής, η μορφή της είναι η γράμμα L:

Ο φυλακτό σας δεν υποστηρίζει την ετικέτα HTML5 canvas.

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

Δοκιμάστε το προσωπικά

Υποστήριξη προγράμματος περιήγησης

Ο αριθμός στη διάταξη σημαίνει την έκδοση του προγράμματος περιήγησης που υποστηρίζει πλήρως το χαρακτηριστικό.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Σημείωση:O Internet Explorer 8 και οι προηγούμενες εκδόσεις δεν υποστηρίζουν το στοιχείο <canvas>.

Παρατηρητήριο Canvas