SOURCE

let canvas=document.getElementById('canvas');
let ctx=canvas.getContext('2d');
ctx.beginPath()//新建一个路径，绘制到这个指定路径上
ctx.moveTo(5,69)//绘制图形的起点

ctx.lineTo(195,69)  //第一步连接到这个点

ctx.lineTo(41,181) //第二步
ctx.lineTo(100,0)  //第三步
ctx.lineTo(159,181) //第四步
ctx.lineTo(5,69)  //第五步
ctx.closePath()//调用路径闭合的方法，按照顺序把所有的点用线连起来
ctx.strokeStyle='red';
ctx.stroke()

setInterval(()=>{
ctx.clearRect(-100,-100,500,500) //把这个区域的内容清空
ctx.beginPath()//新建一个路径，绘制到这个指定路径上
ctx.moveTo(5,69)//绘制图形的起点

ctx.lineTo(195,69)  //第一步连接到这个点

ctx.lineTo(41,181) //第二步
ctx.lineTo(100,0)  //第三步
ctx.lineTo(159,181) //第四步
ctx.lineTo(5,69)  //第五步
ctx.closePath()//调用路径闭合的方法，按照顺序把所有的点用线连起来
ctx.strokeStyle='red';

 // 坐标位移
ctx.translate(195, 69); //让五角星绕着点（195,69）进行旋转
ctx.rotate(-5 * Math.PI / 180);
ctx.translate(-195, -69);
// 此时绘制图片就是中心旋转了

ctx.stroke()
  

},100)

<canvas width="570" height="270" id="canvas"></canvas>
<div>canvas画五角星</div>

*{
margin: 0;
padding: 0;
}

div{
text-align: center;
}