ตัวอย่าง
สร้างวงกลม:
javascript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.arc(100,75,50,0,2*Math.PI);
ctx.stroke(); ลองตัวเอง» สนับสนุนเบราว์เซอร์
ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่วิธีการ
| วิธี | |||||
|---|---|---|---|---|---|
| arc() | ใช่ | 9.0 | ใช่ | ใช่ | ใช่ |
ความหมายและการใช้งาน
arc() วิธีการสร้างส่วนโค้ง / Curve (ใช้ในการสร้างวงกลมหรือบางส่วนของวงกลม)
เคล็ดลับ: การสร้างวงกลมที่มี arc() : ชุดเริ่มต้นมุม 0 และมุมสิ้นไป 2 * Math.PI
เคล็ดลับ: ใช้ stroke() หรือ fill() วิธีการที่จริงการวาดโค้งบนผืนผ้าใบ
ศูนย์
โค้ง (100,75, 50,0 * Math.PI 1.5 * Math.PI) เริ่มต้นมุม
โค้ง (100,75,50, 0, 1.5 * Math.PI) มุม End
โค้ง (100,75,50,0 * Math.PI 1.5 * Math.PI) | ไวยากรณ์ javascript: | context.arc(x,y,r,sAngle,eAngle,counterclockwise); |
|---|
ค่าพารามิเตอร์
| พารามิเตอร์ | ลักษณะ | เล่น |
|---|---|---|
| x | พิกัด x ที่ศูนย์ของวงกลม | เล่น " |
| y | พิกัด y ที่ศูนย์ของวงกลม | เล่น " |
| r | รัศมีของวงกลม | เล่น " |
| sAngle | มุมเริ่มต้นในเรเดียน (0 อยู่ที่ตำแหน่ง 03:00 ของวงกลมส่วนโค้ง) | เล่น " |
| eAngle | มุมสิ้นสุดในเรเดียน | เล่น " |
| counterclockwise | ไม่จำเป็น ระบุว่าการวาดภาพที่ควรจะเป็นหรือทวนเข็มนาฬิกา เท็จเป็นค่าเริ่มต้นและบ่งชี้ตามเข็มนาฬิกาในขณะที่ความจริงแสดงให้เห็นทวนเข็มนาฬิกา | เล่น " |