JavaScript arkaly canvas üstünde töwerekleri çyzmak
Indiki usul arc käbir nokatda merkezi bolan arka çyzyar. Ol aşakdaky
parametrleri kabul edýär: x, y, radius r,
başlangyç burç startAngle, ahyrky
burç endAngle, sagat ýönünde ýa-da tersine
çyzmak direction.
direction parametri aşakdaky bahalary kabul edýär: true sagat
ýönünde çyzmaga mäcbür edýär, false sagat tersine (deslapky ýagdaýynda).
Şeýlelikde, arc usulyndaky burçlar radianda ölçelýär,
gradusda däl. Graduslary radianda öwürmek üçin
siz aşakdaky funksiýany ulanyp bilersiňiz:
function getRadians(degrees) {
return (Math.PI / 180) * degrees;
}
Töwerek çyzalyň
<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();
:
Töweregiň ýarysyny çyzalyň
<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();
:
Töweregiň ýarym çykarylyşyny çyzalyň
<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(); // kontury boýalyň
:
