مетод createRadialGradient() کانواس
تعریف و استفاده
createLinearGradient() با استفاده از روش ایجاد شیء گرادیان محورگردشی/دایره‌ای.
گرادیان می‌تواند برای پر کردن مستطیل‌ها، دایره‌ها، خطوط، متن و غیره استفاده شود.
نکته:از این شیء به عنوان strokeStyle یا fillStyle مقدار ویژگی.
نکته:لطفاً از addColorStop() این روش رنگ‌های مختلف را مشخص می‌کند و جایی که رنگ‌ها در شی گرادیان قرار می‌گیرند.
مثال
یک مستطیل بکشید و آن را با گرادیان محورگردشی/دایره‌ای پر کنید:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var grd=ctx.createRadialGradient(75,50,5,90,60,100);
grd.addColorStop(0,"red");
grd.addColorStop(1,"white");
// با گرادیان پر کنید
ctx.fillStyle=grd;
ctx.fillRect(10,10,150,100);
قوانین
context.createRadialGradient(x0,y0,r0,x1,y1,r1);
مقدار پارامتر
| پارامترها | توضیحات |
|---|---|
| x0 | مختصات x دایره‌ای که شروع می‌شود. |
| y0 | مختصات y دایره‌ای که شروع می‌شود. |
| r0 | قطر دایره‌ای که شروع می‌شود. |
| x1 | مختصات x دایره‌ای که به پایان می‌رسد. |
| y1 | مختصات y دایره‌ای که به پایان می‌رسد. |
| r1 | قطر دایره‌ای که به پایان می‌رسد. |
پشتیبانی مرورگر
اعداد در جدول نشان‌دهنده نسخه‌ای اولین از مرورگرهای پشتیبان از این ویژگی هستند.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
نکته:نسخه‌های 8 و قدیمی‌تر اینترنت اکسپلورر از عنصر <canvas> پشتیبانی نمی‌کنند.
