用HTML 5 canvas绘制五角大楼

Question

我需要在Javascript中使用html 5 canvas绘制五角大楼。这里写的不多。我试图查找它，但很多的例子不能正常工作。

Answer 1

五角形开始于3oclock pos使用旋转以弧度更改开始位置。即从顶部开始旋转-90deg = -Math.PI/2

function pentagon(x, y, radius, rotation){ 
    for(var i = 0; i < 5; i ++){ 
     const ang = (i/5) * Math.PI * 2 + rotation; 
     ctx.lineTo(
      Math.cos(ang) * radius + x, 
      Math.sin(ang) * radius + y 
     ); 
    } 
    ctx.closePath(); 
) 

ctx.beginPath(); 
pentagon(100,100,50,-Math.PI/2); 
ctx.fill(); 
ctx.stroke();