विधि 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();

Результат:

यह भी देखें