Canvas textAlign ιδιότητα
Ορισμός και χρήση
textAlign Η ιδιότητα βασίζεται στον άγκυρα, ρυθμίζει ή επιστρέφει τον τρέχοντα τρόπο συναρμολόγησης του κειμένου.
Γενικά, το κείμενο ξεκινά από τη καθορισμένη θέση, αλλά αν ορίσετε textAlign="right" και τοποθετήσετε το κείμενο στη θέση 150, τότε το κείμενο θα τελειώσει στη θέση 150.
Σuggestion:με χρήση fillText() ή strokeText() Τα μεθόδους εφαρμόζονται πραγματικά στο canvas και τοποθετούνται το κείμενο.
Παράδειγμα
Δημιουργία μιας κόκκινης γραμμής στη θέση 150. Η θέση 150 είναι ο άξονας όλων των κειμένων στην παρακάτω παράδειγμα. Εξετάστε την επίδραση κάθε τιμής textAlign:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
// Δημιουργία μπλε γραμμής στη θέση 150
ctx.strokeStyle="blue";
ctx.moveTo(150,20);
ctx.lineTo(150,170);
ctx.stroke();
ctx.font="15px Arial";
// Εμφάνιση διαφορετικών τιμών textAlign
ctx.textAlign="start";
ctx.fillText("textAlign=start",150,60);
ctx.textAlign="end";
ctx.fillText("textAlign=end",150,80);
ctx.textAlign="left";
ctx.fillText("textAlign=left",150,100);
ctx.textAlign="center";
ctx.fillText("textAlign=center",150,120);
ctx.textAlign="right";
ctx.fillText("textAlign=right",150,140);
Γραμματική
κείμενο.textAlign="center|end|left|right|start";
Τιμή ιδιότητας
| Τιμή | Περιγραφή |
|---|---|
| start | Προεπιλεγμένο. Το κείμενο ξεκινά στη καθορισμένη θέση. |
| τελος | Το κείμενο τελειώνει στη καθορισμένη θέση. |
| κέντρο | Η κεντρική θέση του κειμένου τοποθετείται στη καθορισμένη θέση. |
| αριστερά | Η κείμενη αριστερή ακροάση. |
| δεξιά | Η κείμενη αριστερή ακροάση. |
Τεχνικά λεπτομέρειες
| Προεπιλεγμένη τιμή: | start |
|---|
Υποστήριξη των προγραμμάτων περιήγησης
Τα αριθμήματα στην τάβληση σηματοδοτούν την έκδοση του πρώτου προγράμματος που υποστηρίζει αυτή την ιδιότητα.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Σημείωση:Ο Internet Explorer 8 και οι προηγούμενες εκδόσεις δεν υποστηρίζουν το στοιχείο <canvas>.
