1.画圆
属性：ctx.arc(x, y, R, start, hudu, boolean）
其中，x,y表示坐标，R表示半径长，start表示起始，hudu表示要画的弧度，boolean表示要画的角度大小
例子：（画逆时针）
<canvas id="canvas1" width="600" height="600">正常的画布是不显示的</canvas><script type="text/javascript">var canvas1 = document.querySelector("#canvas1")var ctx = canvas1.getContext('2d')//默认为false,是顺时针，true为逆时针ctx.arc(200,200,100,0,Math.PI,true)ctx.fillStyle = 'bisque'ctx.fill()ctx.stroke()</script>
结果：
例子：（画顺时针）
同上面代码，其中
ctx.arc(200,200,100,0,Math.PI,false)//修改此句
结果：
例子：画整个圆
ctx.arc(200,200,100,0,2*Math.PI,false)
结果：
2.画文本
属性：
fillText(text, x, y, [maxWidth])
strokeText(text, x, y, [maxWidth])
*可选参数maxWidth为文本的最大宽度，单位为像素。如果设置了该属性，当文本内容宽度超过该参数值，则会自动按比例缩小字体，使文本的内容全部可见；未超过时，则以实际宽度显示。如果未设置该属性，当文本内容宽度超过画布宽度时，超出的内容将被隐藏。
例子：
<canvas id="canvas1" width="600" height="600">正常的画布是不显示的</canvas><script type="text/javascript">var canvas1 = document.querySelector("#canvas1")var ctx = canvas1.getContext('2d')ctx.font = "50px 微软雅黑"//设置阴影ctx.shadowBlur = 20;ctx.shadowColor = "rgba(0,0,0,1)"//阴影相对于文本的偏移量ctx.shadowOffsetX = 10ctx.shadowOffsetY = 10ctx.fillText("hello world",100,100)ctx.strokeText("中午吃啥？",200,300)</script>
结果：
设置简单动画例子：
<canvas id="canvas1" width="600" height="600">正常的画布是不显示的</canvas><script type="text/javascript">var canvas1 = document.querySelector("#canvas1")var ctx = canvas1.getContext('2d')ctx.font = "50px 微软雅黑"//设置阴影ctx.shadowBlur = 20;ctx.shadowColor = "rgba(0,0,0,1)"//阴影相对于文本的偏移量ctx.shadowOffsetX = 10ctx.shadowOffsetY = 10ctx.fillText("hello world",100,100)ctx.strokeText("中午吃啥？",200,300)//设置定时偏移var x = 600setInterval(function(){//清空画布ctx.clearRect(0,0,600,600)x -= 10if (x < -100) x = 600ctx.fillText("hello world",x,100)ctx.strokeText("中午吃啥？",x,300)},100)</script>
结果：
