Canvas createLinearGradient() পদ্ধতি
সংজ্ঞা এবং ব্যবহার
createLinearGradient() পদ্ধতি একটি লাইনিয়ার গ্রেডিয়েন্ট অবজেক্ট তৈরি করে।
গ্রেডিয়েন্ট বর্গ, বক্তৃতা, লাইন, টেক্সট ইত্যাদির পূর্ণ রং হিসাবে ব্যবহার করা যেতে পারে。
সুঝাওয়া:এই অবজেক্টটি হিসাবে strokeStyle বা fillStyle প্রতিভূতির মান
সুঝাওয়া:ব্যবহার করুন addColorStop() এই পদ্ধতি বিভিন্ন রংকে নির্দিষ্ট করে, এবং gradient অবজেক্টের কোথায় রং অবস্থিত হবে
এককলব
আরও দেখুন:
একটি কালো থেকে সাদা পর্যন্ত গ্রেডিয়েন্ট (ডান থেকে বাঁদ) নির্ধারণ করে, যা বর্গটির পূর্ণ রং হিসাবে ব্যবহার করা হবে:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var grd=ctx.createLinearGradient(0,0,170,0);
grd.addColorStop(0,"black");
grd.addColorStop(1,"white");
ctx.fillStyle=grd;
ctx.fillRect(20,20,150,100);
গঠনকারী
context.createLinearGradient(x0,y0,x1,y1);
পারামিটার মান
| পারামিটার | বর্ণনা |
|---|---|
| x0 | গ্রেডিয়েন্ট ভাববিন্দুর x অক্ষাংশ |
| y0 | গ্রেডিয়েন্ট ভাববিন্দুর y অক্ষাংশ |
| x1 | গ্রেডিয়েন্ট শেষ বিন্দুর x অক্ষাংশ |
| y1 | গ্রেডিয়েন্ট শেষ বিন্দুর y অক্ষাংশ |
আরও এককলব
এককলব 2
একটি গ্রেডিয়েন্ট (উপর থেকে নিচে) নির্ধারণ করে, যা বর্গটির পূর্ণ রং হিসাবে ব্যবহার করা হবে:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var my_gradient=ctx.createLinearGradient(0,0,0,170);
my_gradient.addColorStop(0,"black");
my_gradient.addColorStop(1,"white");
ctx.fillStyle=my_gradient;
ctx.fillRect(20,20,150,100);
এককলব 3
একটি কালো থেকে লাল এবং সাদা পর্যন্ত গ্রেডিয়েন্ট নির্ধারণ করে, যা বর্গটির পূর্ণ রং হিসাবে ব্যবহার করা হবে:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var my_gradient=ctx.createLinearGradient(0,0,170,0);
my_gradient.addColorStop(0,"black");
my_gradient.addColorStop(0.5,"red");
my_gradient.addColorStop(1,"white");
ctx.fillStyle=my_gradient;
ctx.fillRect(20,20,150,100);
ব্রাউজারের সমর্থন
এই টেবিলের সংখ্যা প্রথমবার এই বৈশিষ্ট্যকে সম্পূর্ণরূপে সমর্থনকারী ব্রাউজারের সংস্করণটি উল্লেখ করে।
| চ্রোম | এজ | ফায়ারফক্স | স্যাফারি | অপেরা |
|---|---|---|---|---|
| চ্রোম | এজ | ফায়ারফক্স | স্যাফারি | অপেরা |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
মন্তব্য:Internet Explorer 8 এবং তার পূর্ববর্তী সংস্করণগুলি <canvas> উপাদানটি সমর্থন করে না。
