এই মেথড একটি CanvasGradient অবজেক্ট রিটার্ন করে যা একটি লিনিয়ার গ্রেডিয়েন্টকে প্রতিনিধিত্ব করে যা আর্গুমেন্ট্স দ্বারা প্রতিনিধিত্ব করা কোঅর্ডিনেটস দ্বারা দেওয়া লাইন کے সাথে সাথে পেইন্ট করে। চারটি আর্গুমেন্ট গ্রেডিয়েন্টের শুরুর পয়েন্ট (x1,y1) এবং শেষ পয়েন্ট (x2,y2) উপস্থাপন করে।
createLinearGradient(x0, y0, x1, y1)
createLinearGradient() মেথডের প্যারামিটার ভ্যালুগুলো নিচে দেওয়া হলো:
| S.No | প্যারামিটার ও বর্ণনা |
|---|---|
| 1 | x0 x-কোঅর্ডিনেট - গ্রেডিয়েন্টের শুরুর পয়েন্ট |
| 2 | y0 y-কোঅর্ডিনেট - গ্রেডিয়েন্টের শুরুর পয়েন্ট |
| 3 | x1 x-কোঅর্ডিনেট - গ্রেডিয়েন্টের শেষ পয়েন্ট |
| 4 | y1 y-কোঅর্ডিনেট - গ্রেডিয়েন্টের শেষ পয়েন্ট |
উদাহরণ
নিচের কোড চালিয়ে দেখুন HTML5-এ লিনিয়ার গ্রেডিয়েন্ট আঁকার পদ্ধতি:
<!DOCTYPE html> <html> <head> <title>HTML5 Linear Gradient</title> </head> <body> <canvas id="newCanvas" width="450" height="250" style="border:1px solid #d3d3d3;"></canvas> <script> var c = document.getElementById("newCanvas"); var ctxt = c.getContext("2d"); var linegrd = ctxt.createLinearGradient(0, 0, 170, 0); linegrd.addColorStop(0.5, "#E44D26"); linegrd.addColorStop(1, "#66CC00"); ctxt.fillStyle = linegrd; ctxt.fillRect(50, 80, 300, 100); </script> </body> </html>
