Canvas strokeText() μέθοδος
Ορισμός και χρήση
strokeText() Μέθοδος που χρησιμοποιείται για να ζωγραφίσει κείμενο στο canvas (χωρίς χρώμα πλήρωσης). Η προεπιλεγμένη απόχρωση είναι μαύρη.
Συμβουλή:Παρακαλώ χρησιμοποιήστε font ιδιότητα για να καθορίσετε το γραμματοσειρά και το μέγεθος, και να χρησιμοποιήσετε strokeStyle Αναπαράσταση των ιδιοτήτων με άλλο χρώμα/διακρίνουσα χρώματος.
Παράδειγμα
Χρησιμοποιήστε το strokeText() για να γράψετε το κείμενο "Hello world!" και "codew3c.com" στο canvas:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.font="20px Georgia";
ctx.strokeText("Hello World!",10,50);
ctx.font="30px Verdana";
// Δημιουργία διακρίνουσας χρώματος
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Χρήση διακρίνουσας χρώματος
ctx.strokeStyle=gradient;
ctx.strokeText("codew3c.com",10,90);
Γλώσσα
context.strokeText(text,x,y,maxWidth);
Τιμή παράμετρου
| Παράμετρος | Περιγραφή |
|---|---|
| text | Καθορίζει το κείμενο που θα εμφανιστεί στο canvas. |
| x | Η θέση x της κεντρικής γραμμής του κειμένου που ξεκινά την απόδοση (σχετικά με το canvas). |
| y | Η θέση y της κεντρικής γραμμής του κειμένου που ξεκινά την απόδοση (σχετικά με το canvas). |
| maxWidth | Επιλογή. Η μέγιστη πλάτος κειμένου, μετρημένη σε pixel. |
Υποστήριξη από τους περιηγητές
Τα αριθμήματα στην τаблицή δείχνουν την έκδοση του προγράμματος περιήγησης που υποστηρίζει πλήρως αυτό το χαρακτηριστικό.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Σημείωση:Οι εκδόσεις Internet Explorer 8 και παλιότερες δεν υποστηρίζουν το στοιχείο <canvas>.
