روش 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 |
نکته:اینترنت اکسپلورر 8 و نسخه‌های قبلی از عناصر <canvas> پشتیبانی نمی‌کنند.
