ตัวอย่าง
สร้างวงกลม:
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() | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
ความหมายและการใช้งาน
arc() วิธีการสร้างส่วนโค้ง / เส้นโค้ง (used to create circles, or parts of circles)
Tip: การสร้างวงกลมที่มี arc() : ชุดเริ่มต้นมุม 0 และมุมสิ้นไป 2 * Math.PI
Tip: ใช้ stroke() หรือ fill() วิธีการที่จริงการวาดโค้งบนผืนผ้าใบ
ศูนย์
arc( 100,75 ,50,0*Math.PI,1.5*Math.PI) เริ่มต้นมุม
arc(100,75,50, 0 ,1.5*Math.PI) มุม End
arc(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 | ไม่จำเป็น. ระบุว่าการวาดภาพที่ควรจะเป็นหรือทวนเข็มนาฬิกา เท็จเป็นค่าเริ่มต้นและบ่งชี้ตามเข็มนาฬิกาในขณะที่ความจริงแสดงให้เห็นทวนเข็มนาฬิกา | เล่น " |
<ผ้าใบวัตถุ