Μέθοδος HTML canvas arc()
Ορισμός και χρήση
arc() Η μέθοδος αυτή δημιουργεί έλκη/κривές (χρησιμοποιείται για τη δημιουργία κύκλων ή μερών κύκλων).
Σημείωση:Για να δημιουργήσετε έναν κύκλο μέσω του arc(), ορίστε τη γωνία έναρξης σε 0και η γωνία λήξης ορίζεται σε 2*Math.PI.
Σημείωση:Χρησιμοποιήστε stroke() ή fill() Η μέθοδος αυτή ζωγραφίζει πραγματικά το έλκος στο χαρτί.
- Κέντρο: arc(
100,75,50,0*Math.PI,1.5*Math.PI) - Γωνία έναρξης: arc(100,75,50,
0,1.5*Math.PI) - Γωνία λήξης: arc(100,75,50,0*Math.PI,
1.5*Math.PI)
Παράδειγμα
Δημιουργία ενός κύκλου:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.arc(100,75,50,0,2*Math.PI);
ctx.stroke();
Γραμματική
context.arc(x,y,r,sAngle,eAngle,counterclockwise);
Παράμετροι τιμών
| Παράμετροι | Περιγραφή |
|---|---|
| x | Η συντεταγμένη x του κέντρου του κύκλου. |
| y | Η συντεταγμένη y του κέντρου του κύκλου. |
| r | Η ακτίνα του κύκλου. |
| sAngle | Αρχή γωνίας, μετρημένο σε ακτίνες. (Η γωνία του κύκλου στις 3 το μεσημέρι είναι 0 βαθμούς). |
| eAngle | Τέλος γωνίας, μετρημένο σε ακτίνες. |
| counterclockwise | Προαιρετικό. Προσδιορίζει αν η διαγράμμιση θα γίνει κατά μήκος της αντίθετης κατεύθυνσης του ρολογιού ή κατά μήκος της κατεύθυνσης του ρολογιού. False = κατά μήκος της κατεύθυνσης του ρολογιού, true = κατά μήκος της αντίθετης κατεύθυνσης του ρολογιού. |
Υποστήριξη του προγράμματος περιήγησης
Ο αριθμός στη τάβλη αναφέρει την έκδοση του πρώτου προγράμματος που υποστηρίζει αυτήν την ιδιότητα.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Σημείωση:Οι εκδόσεις του Internet Explorer 8 και παλιότερες δεν υποστηρίζουν το στοιχείο <canvas>.
