const canvas = document.getElementById("canvas");
const cxt =  canvas.getContext("2d");

cxt.beginPath();
const x =  50; // x 坐标值
const y = 50; // y 坐标值
const radius = 50; // 圆弧的半径
const startAngle = 0  // 开始的弧度
const endAngle = 1 // 结束的弧度; 1弧度等于半径的长度
const articlockwise = true; // 逆时针画
cxt.beginPath(); // 开始绘制路径
cxt.arc(x, y, radius, startAngle, endAngle, articlockwise);
cxt.closePath();
cxt.stroke();

cxt.beginPath();
cxt.arc(150, 150, 50, 2, 4, false);
cxt.fill();

cxt.beginPath();
cxt.arc(200, 200, 50, 6, 8, true);
cxt.fill();