Μέθοδος 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>.