JavaScript'те canvas аркылуу тегеректерди тартуу

Кийинки arc ыкмасы белгилүү бир чекиттин борборунда доону тартат. Ал төмөнкү параметрлерди кабыл алат: x, y, радиус r, башталгыч бурч startAngle, аяктоо бурчу endAngle, саат жебеси боюнча же ага каршы тартуу direction.

direction параметри төмөнкү маанилерди кабыл алат: true саат жебеси боюнча тартууну талап кылат, false саат жебесине каршы (демейки абал).

arc ыкмасындагы бурчтар радиандарда өлчөнөт, градустарда эмес. Градустарды радиандарга которуу үчүн төмөнкү функцияны колдонсоңуз болот:

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

Тегерек тартайлы

html<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>
javascriptlet canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');

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

Результат:

Тегеректин жарымын тартайлы

html<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>
javascriptlet canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');

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

Результат:

Айлананын жарымын тартайлы

html<canvas width="200" height="200" style="background: #f4f4f4;"></canvas>
javascriptlet canvas = document.querySelector('canvas');
let ctx = canvas.getContext('2d');

ctx.arc(100, 100, 75, 0, getRadians(180));
ctx.fill(); // контурду боёйлу

Результат:

Практикалык тапшырмалар

Задание 1
Задание 2
Задание 3
Задание 4
Задание 5
Задание 6