Arc metodu

arc metodu, merkezi bellenen nokatda, bellenen radiusly arka çyzýar. Bu arka, diňe stroke ýa-da fill metodlary ulanylanda görünjek. Birinjide kontur, ikinjide bolsa şekil bolýar.

Iň soňky islege görä parametr, çyzugyň ugruny düzgünleşdirýär. Ol true ýa-da false görnüşini alýar. true bahasy, sagat eýresi boýunça arka çyzýar, false bahasy bolsa sagat eýresiniň tersine çyzýar (bölegiň öňünden bellidir).

Çyzgyda başlangyç we soňky burçlary belläp bolýar. Bu burçlar radianda ölçenýär, gradusda däl. Gradusy radianda öwürmek üçin aşakdaky funksiýany ulanyp bilersiňiz:

function getRadians(degrees) {
	return (Math.PI / 180) * degrees;
}

Sintaksis

kontekst.arc(x, y, radius, başlangyç burç, soňky burç, [ugur = false]);

Mysal

Geliň, bir tegelek çyzyň:

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

let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.arc(100, 100, 75, 0, getRadians(360));
ctx.stroke();

function getRadians(degrees) {
	return (Math.PI / 180) * degrees;
}

Mysal

Geliň, tegeleğiň ýarysyny çyzyň:

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

let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.arc(100, 100, 75, 0, getRadians(180));
ctx.stroke();

function getRadians(degrees) {
	return (Math.PI / 180) * degrees;
}

Mysal

Geliň, daýryň ýarysyny çyzyň (kontury fill arkaly dolduryň):

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

let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.arc(100, 100, 75, 0, getRadians(180));
ctx.fill();

function getRadians(degrees) {
	return (Math.PI / 180) * degrees;
}

Şeýle-de serediň

rect metodu,
şeýle hem töwerek çyzýar