Дуги

Для создания фигур, включающих в себя различные дуги, в API предусмотрены специальные методы.

Метод arc() предназначен для рисования окружностей или дуг. Обратите внимание на значение PI (данный метод ориентируется на значение угла в радианах, а не в градусах). Значение PI в радианах соответствует 180°. Формула PI x 2 в итоге дает 360°.

function initiate(){
  var elem = document.getElementById('canvas');
  var canvas = elem.getContext('2d');
  canvas.beginPath();
  canvas.arc(100, 100, 50, 0, Math.PI * 2, false);
  canvas.stroke();
}
addEventListener("load", initiate);

Для создания дуги с определенным углом в градусах  нужно воспользоваться формулой:

Math.PI/180 x градусы

Дуга с углом в 45°.

function initiate(){
  var elem = document.getElementById('canvas');
  var canvas = elem.getContext('2d');
  canvas.beginPath();
  var radians = Math.PI / 180 * 45;
  canvas.arc(100, 100, 50, 0, radians, false);
  canvas.stroke();
}
addEventListener("load", initiate);