विधि 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,
जो आकृति को दिए गए रंग से भरती है
