canvas 2d api 如何绘圆

Canvas 2D API 是 HTML5 标准中的一部分，它提供了一种在 Web 页面上绘制图形的方式。要使用 Canvas 2D API 绘制圆形，可以使用以下代码：

// 获取 canvas 元素
var canvas = document.getElementById("myCanvas");

// 获取 2D 绘图上下文
var ctx = canvas.getContext("2d");

// 设置圆形属性
ctx.fillStyle = "red"; // 填充颜色
ctx.strokeStyle = "black"; // 边框颜色
ctx.lineWidth = 2; // 边框宽度

// 绘制圆形
ctx.beginPath(); // 开始路径
ctx.arc(100, 100, 50, 0, 2 * Math.PI); // 绘制圆形
ctx.fill(); // 填充圆形
ctx.stroke(); // 绘制边框
ctx.closePath(); // 结束路径

上述代码中，先获取了 canvas 元素和 2D 绘图上下文，然后设置了圆形的属性，包括填充颜色、边框颜色和边框宽度。接着使用 `beginPath()` 方法开始路径，使用 `arc()` 方法绘制圆形，并使用 `fill()` 方法填充圆形，使用 `stroke()` 方法绘制边框，最后使用 `closePath()` 方法结束路径。