Круги HTML Canvas

Пример

Ваш браузер не поддерживает тег HTML5 canvas.
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(95, 50, 40, 0, 2 * Math.PI);
ctx.stroke();

попробуйте сами

нарисовать круг

Чтобы нарисовать圆形 на канвасе, используйте следующие методы:

  • beginPath() - начать путь
  • arc(x,y,r,start,end) - определить круг
  • stroke() - нарисовать

arc(x,y,r,start,end) - создать дугу (кривую).

Чтобы создать круг, установите начальный угол в 0 и конечный угол в 2 * Math.PI.

Параметры x и y определяют координаты центра круга.

Параметр r определяет радиус круга.

Дополнительная информация:

Полное руководство по Canvas CodeW3C.com