用canvas绘制五角星

好的，下面是用 canvas 绘制五角星的代码：

<canvas id="star" width="200" height="200"></canvas>

const canvas = document.getElementById('star');
const ctx = canvas.getContext('2d');

const centerX = canvas.width / 2;
const centerY = canvas.height / 2;
const radius = 60; // 外圆半径
const angle = Math.PI * 2 / 5; // 五角星角度
const innerRadius = radius / 2.6; // 内圆半径

ctx.beginPath();
ctx.moveTo(centerX + radius * Math.cos(0), centerY + radius * Math.sin(0));
for (let i = 1; i <= 5; i++) {
  ctx.lineTo(centerX + radius * Math.cos(angle * i), centerY + radius * Math.sin(angle * i));
  ctx.lineTo(centerX + innerRadius * Math.cos(angle * i + angle / 2), centerY + innerRadius * Math.sin(angle * i + angle / 2));
}
ctx.closePath();
ctx.fillStyle = 'yellow';
ctx.fill();

希望这个代码能够帮到你！