এই পদ্ধতিটি একটি ক্যানভাস গ্রেডিয়েন্ট অবজেক্ট প্রদান করে যা একটি রৈখিক গ্রেডিয়েন্টকে উপস্থাপন করে যা আর্গুমেন্ট দ্বারা উপস্থাপিত স্থানাঙ্ক দ্বারা প্রদত্ত রেখা বরাবর পেইন্ট করে। চারটি আর্গুমেন্ট গ্রেডিয়েন্টের প্রারম্ভিক বিন্দু (x1,y1) এবং শেষ বিন্দু (x2,y2) উপস্থাপন করে।
createLinearGradient(x0, y0, x1, y1)
এখানে createLinearGradient() পদ্ধতির প্যারামিটার মান রয়েছে -
| S.No | প্যারামিটার এবং বর্ণনা |
|---|---|
| 1 | x0 x-coordinate- গ্রেডিয়েন্টের প্রারম্ভিক বিন্দু |
| 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> 