如何用直线和圆弧正确填充HTML画布？

我想创建一个由直线和曲线组成的图形，如下所示。 我还想填补这个空缺

您的浏览器不支持HTML5画布标记。 var c=document.getElementByIdmyCanvas； var ctx=c.getContext2d； ctx.beginPath； //半弧 ctx.arc100,75,50,0.5*Math.PI，1.5*Math.PI； ctx.moveto100125； ctx.lineto10125；//底线 ctx.lineTo10,25；//左行 ctx.lineTo100，25；//左行 ctx.stroke；

---

你必须按逻辑顺序画线

var c=document.getElementByIdmyCanvas； var ctx=c.getContext2d； ctx.beginPath； ctx.moveto100125 ctx.arc100,75,50,0.5*Math.PI，1.5*Math.PI； ctx.lineTo10，25；//左线 ctx.lineto10125；//要旨 ctx.closePath ctx.stroke； ctx.fill 您的浏览器不支持HTML5画布标记。