html5中圆形的绘制

圆形的绘制

context.arc(x,y,radius,startingAngle,endingAngle,anticlockwise);
x，y:表示圆心坐标。
radius：圆的半径。
startingAngle：绘制圆弧的起始位置（弧度制，比如0，0.5*Math.PI.....）。
endingAngle:绘制圆弧的终止位置。

绘制圆的方法
<canvas id="mycans" style="border:8px solid pink;"></canvas>
    <script>
        //  抓取元素
        var mycans = document.querySelector('#mycans')
        console.log(mycans);
        // 设置画布的宽度和高度
        mycans.width =800;
        mycans.height =800;
        // 调用getContext(),返回给我们一个对象，这个对象里提供了若干个方法，供我们去绘制图形
        var ctx =mycans.getContext('2d')
        console.log (ctx);
        // 开始绘制路径  画画
        ctx.beginPath();
        //  准备要使用的颜色
        ctx.fillStyle ='yellow';
        ctx.strokeStyle ='orange';
        ctx.lineWidth =35;
        // 画画---圆
        //  context.arc(x,y,radius,startingAngle,endingAngle,anticlockwise);