گرادیانت را میتوان در canvas ها برای پر کردن مستطیل ها ، دایره ها ، خطوط ، متون و سایر چیزها استفاده کرد . اشکال در canvas تنها محدود به تک رنگ ها نیستند.
دو نوع مختلف از Gradient ها وجود دارند.
createLinearGradient(x,y,x1,y1)– که یک گرادیانت خطی میسازد.
createRadialGradient(x,y,r,x1,y1,r1) که گرادیانت راداری/مدور میسازد.
بعد از اینکه یک شکل با gradient ساختیم ، باید دو یا چند ایستگاه رنگ اضافه کنیم .
متد addColorStop() ایستگاه های رنگ و جایگاه های آنها در gradient را مشخص میکند. نقاط gradient میتواند هرجایی بین ۰ و ۱ باشد.
برای استفاده از gradient ، پروپرتی های fillStyle و strokeStyle را بهgradient بدهید سپس شکل را بکشید ، مانند یک مستطیل ، یک متن و یا یک خط .
استفاده از createLinearGradient() :
یک gradient خطی بکشید . مستطیل را با gradient پر کنی
استفاده از createRadialGradient() :
یک gradient راداری/مدور بسازید . مستطیل را با gradient پر کنید.
