closePath পদ্ধতি

closePath পদ্ধতিটি lineTo পদ্ধতি ব্যবহার করে আঁকা আকৃতিটি স্বয়ংক্রিয়ভাবে বন্ধ করে, শেষ বিন্দু থেকে প্রারম্ভিক বিন্দুতে একটি সরল রেখা আঁকে। যদি আকৃতিটি ইতিমধ্যেই বন্ধ থাকে বা শুধুমাত্র একটি বিন্দু হয়, তাহলে পদ্ধতিটি কিছুই করে না।

সিনট্যাক্স

javascriptcontext.closePath();

উদাহরণ

প্রথমে closePath ব্যবহার না করে দুটি রেখা আঁকা যাক:

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet 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 ব্যবহার করে এই দুটি রেখাকে একটি আকৃতিতে বন্ধ করুন, যার ফলে একটি ত্রিভুজ পাওয়া যায়:

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet 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 ব্যবহার করে আকৃতিটি বন্ধ করে:

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

javascriptlet 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();

Результат:

আরও দেখুন