წრეწირების ხატვა canvas-ის მეშვეობით JavaScript-ში
შემდეგი მეთოდი arc ხაზავს რკალს
ცენტრით გარკვეულ წერტილში. ის იღებს შემდეგ
პარამეტრებს: x, y, რადიუსი r,
საწყისი კუთხე startAngle, საბოლოო
კუთხე endAngle, ხაზვა საათის ისრის მიმართულებით თუ საწინააღმდეგოდ
direction.
პარამეტრი direction იღებს შემდეგ მნიშვნელობებს: true აიძულებს
ხაზვას საათის ისრის მიმართულებით, false საათის ისრის საწინააღმდეგოდ (ნაგულისხმევად).
ამ შემთხვევაში, კუთხეები arc მეთოდში იზომება რადიანებში,
არა გრადუსებში. გრადუსების რადიანებში გადასაყვანად
შეგიძლიათ გამოიყენოთ შემდეგი ფუნქცია:
function getRadians(degrees) {
return (Math.PI / 180) * degrees;
}
დავხატოთ წრეწირი
<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();
:
დავხატოთ წრეწირის ნახევარი
<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();
:
დავხატოთ წრის ნახევარი
<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(); // გავაფერადოთ კონტური
:
