Методи 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,
ки шаклро бо ранги додашуда рангубор мекунад
