JavaScript арқылы canvas көмегімен шеңберлер салу
Келесі әдіс 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(); // контурды бояйық
:
