Μέθοδος Canvas closePath()

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

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

Συμβουλή:Χρησιμοποιήστε stroke() Η μέθοδος για να ζωγραφίσετε ακριβή διαδρομή στο καanvas.

Συμβουλή:Χρησιμοποιήστε fill() Χρησιμοποιήστε τη μέθοδο για να πλήρωσετε την εικόνα (προεπιλεγμένο είναι το μαύρο). Χρησιμοποιήστε fillStyle Χρησιμοποιήστε την ιδιότητα για να πλήρωσετε με άλλο χρώμα ή διακρίνουσα.

Παράδειγμα

Παράδειγμα 1

Δημιουργήστε μια διαδρομή που έχει τη μορφή του γράμματος 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.closePath();
ctx.stroke();

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

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

Γλώσσα

context.closePath();

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

Παράδειγμα 2

Χρησιμοποιήστε το πράσινο ως χρώμα πλήρωσης:

Ο περιηγητής σας δεν υποστηρίζει την ετικέτα 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.closePath();
ctx.stroke();
ctx.fillStyle="green";
ctx.fill();

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

Υποστήριξη περιηγητή

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

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>.