closePath পদ্ধতি
closePath পদ্ধতিটি
lineTo পদ্ধতি ব্যবহার করে আঁকা আকৃতিটি স্বয়ংক্রিয়ভাবে বন্ধ করে,
শেষ বিন্দু থেকে প্রারম্ভিক বিন্দুতে একটি সরল রেখা আঁকে। যদি আকৃতিটি ইতিমধ্যেই বন্ধ থাকে
বা শুধুমাত্র একটি বিন্দু হয়, তাহলে পদ্ধতিটি কিছুই করে না।
সিনট্যাক্স
context.closePath();
উদাহরণ
প্রথমে closePath ব্যবহার না করে
দুটি রেখা আঁকা যাক:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(100, 100);
ctx.lineTo(150, 50);
ctx.stroke();
:
উদাহরণ
এবং এখন closePath ব্যবহার করে এই দুটি রেখাকে একটি আকৃতিতে বন্ধ করুন,
যার ফলে একটি ত্রিভুজ পাওয়া যায়:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(100, 100);
ctx.lineTo(150, 50);
ctx.closePath(); // রেখাগুলোকে আকৃতিতে বন্ধ করুন
ctx.stroke();
:
উদাহরণ
চলুন একটি বর্গক্ষেত্র আঁকা যাক, শেষ রেখার পরিবর্তে
closePath ব্যবহার করে আকৃতিটি বন্ধ করে:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(150, 50);
ctx.lineTo(150, 150);
ctx.lineTo(50, 150);
ctx.closePath(); // রেখাগুলোকে আকৃতিতে বন্ধ করুন
ctx.stroke();
:
আরও দেখুন
-
fillপদ্ধতি,
যা একটি নির্দিষ্ট রঙ দিয়ে আকৃতিটি পূরণ করে
