2020-12-18

/矩形
ctx.fillRect(x, y, width, height)
//绘制一个填充的矩形

ctx.strokeRect(x, y, width, height)
//绘制一个矩形的边框

ctx.clearRect(x, y, widh, height)
//清除指定的矩形区域，然后这块区域会变的完全透明

//线条路径

ctx.beginPath()
//新建一条路径，路径一旦创建成功，图形绘制命令被指向到路径上生成路径

ctx.moveTo(x, y)
//把画笔移动到指定的坐标(x, y)。相当于设置路径的起始点坐标。

ctx.closePath()
//闭合路径之后，图形绘制命令又重新指向到上下文中

ctx.stroke()
//通过线条来绘制图形轮廓

ctx.fill()
//通过填充路径的内容区域生成实心的图形

// 绘制圆弧
ctx.arc(x, y, r, startAngle, endAngle, anticlockwise):
//以(x, y)为圆心，以r为半径，从tartAngle弧度开始到endAngle弧度结束。anticlosewise是布尔值，true表示逆时针，false表示顺时针。(默认是顺时针)
//这里的度数都是弧度。
//0弧度是指的x轴正方形
//radians=(Math.PI/180)*degrees //角度转换成弧度
ctx.arcTo(x1, y1, x2, y2, radius):
//根据给定的控制点和半径画一段圆弧，最后再以直线连接两个控制点