Μέθοδος HTML canvas quadraticCurveTo()
Ορισμός και χρήση
quadraticCurveTo() μεθόδους για να προσθέσετε έναν σημείο στη διαδρομή χρησιμοποιώντας τον καθορισμένο σημείο ελέγχου της δυαδικής καμπύλης.
Σημείωση:Η δυαδική καμπύλη Βεζιέρ χρειάζεται δύο σημεία. Το πρώτο σημείο είναι το σημείο ελέγχου που χρησιμοποιείται για τον υπολογισμό της δυαδικής καμπύλης, το δεύτερο σημείο είναι το άκρο της καμπύλης. Το σημείο εκκίνησης της καμπύλης είναι ο τελευταίος σημείο της διαδρομής. Αν η διαδρομή δεν υπάρχει, παρακαλώ χρησιμοποιήστε beginPath() και moveTo() μεθόδους για να καθορίσετε το σημείο εκκίνησης.
- Άκρο σημείο: moveTo(
20,20) - Σημείο ελέγχου: quadraticCurveTo(
20,100,200,20) - Άκρο σημείο: quadraticCurveTo(20,100,
200,20)
Σημείωση:Παρακαλώ δείτε Μέθοδος bezierCurveTo()Έχει δύο σημεία ελέγχου αντί για ένα.
Παράδειγμα
Διαγράψτε μια δυαδική καμπύλη Βεζιέρ:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.quadraticCurveTo(20,100,200,20);
ctx.stroke();
Γλώσσα
context.quadraticCurveTo(cpx,cpy,x,y);
Παράμετρος τιμή
| Παράμετροι | Περιγραφή |
|---|---|
| cpx | Η x κόordinate του σημείου ελέγχου της Bezier. |
| cpy | Η y κόordinate του σημείου ελέγχου της Bezier. |
| x | Η x κόordinate του σημείου λήξης. |
| y | Η y κόordinate του σημείου λήξης. |
Υποστήριξη προγράμματος
Οι αριθμοί στη τάβλη αναφέρουν την έκδοση του πρώτου προγράμματος που υποστηρίζει αυτήν την ιδιότητα.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Σημείωση:Ο Internet Explorer 8 και οι προηγούμενες εκδόσεις δεν υποστηρίζουν το στοιχείο <canvas>.
