[TOC] ## 绘制圆弧 方式一: `arc(x, y, r, startAngle, endAngle, anticlockwise)` 以`(x, y)`为圆心，以`r`为半径，从`startAngle`弧度开始到`endAngle`弧度结束。`anticlosewise`是布尔值，`true`表示逆时针，`false`表示顺时针(默认是顺时针)。 注意： 1. 这里的度数都是弧度。 2. `0`弧度是指的`x`轴正方向。 ``` radians=(Math.PI/180)*degrees //角度转换成弧度 ``` 方式二: `arcTo(x1, y1, x2, y2, radius)` 根据给定的控制点和半径画一段圆弧，最后再以直线连接两个控制点。 ## 实例 方式一绘制 ``` var draw=()=>{ let canvas = document.querySelector("#tutorial"); if(!canvas.getContext)return; /** * @type CanvasRenderingContext2D */ let ctx = canvas.getContext("2d"); ctx.beginPath() ctx.arc(50,100,30,0,Math.PI*3/2,false) ctx.stroke() } ```  方式二绘制 ``` var draw=()=>{ let canvas = document.querySelector("#tutorial"); if(!canvas.getContext)return; /** * @type CanvasRenderingContext2D */ let ctx = canvas.getContext("2d"); ctx.beginPath() ctx.moveTo(50,50) ctx.arcTo(200,50,200,250,100) ctx.lineTo(200,200) ctx.stroke() } ``` 绘制为一个圆弧加两条切线