Μέθοδος Canvas quadraticCurveTo()

Περιήγηση του Canvas

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

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

Σημείωση:Η καμπύλη quadraticBezier χρειάζεται δύο σημεία. Το πρώτο σημείο είναι ο σημείο ελέγχου που χρησιμοποιείται για τον υπολογισμό της quadraticBezier, το δεύτερο σημείο είναι το σημείο ολοκλήρωσης της καμπύλης. Το σημείο έναρξης της καμπύλης είναι ο τελευταίος σημείο του τρέχοντος διαδρόμου. Αν δεν υπάρχει δρόμος, χρησιμοποιήστε beginPath() και moveTo() Μέθοδος για να ορίσετε το σημείο έναρξης.

Δύοπλες Βεζιέλ Κ曲ωνύγια
  • Σημείο έναρξης: moveTo(20,20)
  • Σημείο ελέγχου: quadraticCurveTo(20,100,200,20)
  • Σημείο ολοκλήρωσης: quadraticCurveTo(20,100,200,20)

Σημείωση:Δείτε επίσης Μέθοδος bezierCurveTo()Είναι δύο σημεία ελέγχου, όχι ένα.

Παράδειγμα

Διαγράψτε μια καμπύλη quadraticBezier:

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

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 του σημείου 贝塞尔.
cpy Η συντεταγμένη y του σημείου 贝塞尔.
x Η συντεταγμένη x του σημείου ολοκλήρωσης.
y Η συντεταγμένη y του σημείου ολοκλήρωσης.

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

Οι αριθμοί στην τаблицή σημειώνουν την έκδοση του προγράμματος περιήγησης που υποστηρίζει πλήρως αυτήν την ιδιότητα.

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

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

Περιήγηση του Canvas