روش createRadialGradient() کانواس
تعریف و استفاده
createLinearGradient()
با استفاده از روش ایجاد شیء تغییرات محیطی/دایرهای.
تغییرات میتوانند برای پر کردن مستطیلها، دایرهها، خطوط، متن و غیره استفاده شوند.
نکته:از این شیء به عنوان strokeStyle یا fillStyle مقدار ویژگی.
نکته:لطفاً از addColorStop() این روش رنگهای مختلف را مشخص میکند و همچنین جایی که رنگها در شیء gradient قرار میگیرند.
مثال
یک مستطیل بکشید و با تغییرات محیطی/دایرهای پر کنید:
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 | قطر دایره پایان. |
پشتیبانی مرورگر
موجودات میز میگویند نسخه اولیه مرورگر که تمام ویژگیها را پشتیبانی میکند.
کروم | ایج | فائرفاکس | سافری | آپرا |
---|---|---|---|---|
کروم | ایج | فائرفاکس | سافری | آپرا |
4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
توضیح:اینٹرنیشنل ایکسپلورر 8 اور اس سے پہلے کی نسلیں <کینووس> عناصر کو نہیں سپورٹ کرتی ہیں۔