使用canvas绘制圆形步骤:
1、在页面中创建canvas的节点(相当于创建一个画板)，设置CSS样式。(注意：要在行内样式中设置canvas的宽高。)
2、在JS中获取节点，并获取画板(绘画环境)、设置画笔颜色。
var canvas=document.getElementById('canvas');
var cv=canvas.context('2d');
cv.fillStyle='red';
3、绘制圆形。使用arc(x，y，r，开始弧度1，开始弧度2)方法。
前三个好理解就是圆心坐标，半径。
后面两个分别是开始的弧度和结束的弧度。弧度计算公式：角度*Math.PI/180;
cv.arc(300,200,100,0*Math.PI/180,80*Math.PI/180);//从300.200坐标中延伸出一条100像素的线，以300.200为中心做条X,Y轴。并以角度0-80绘画。
4、填充，或者画线。
cv.fill();//填充，或者cv.stroke()画线。
补充：
上面的步骤，可以绘制圆形，半圆，圆弧。绘制不了饼状的图片(类似下面的图片)。需要先声明并添加起点。cv.beginPath();cv.moveTo(x,y);
出现的问题：
当前编辑器：HBuilder.
1、在进入工程时，出现缺少描述文件的东西，导致工程打不开。
缺少描述文件
解决办法：把该文件夹中所有文件全部复制到新的文件夹中，然后在导入进工程。
2、在编辑时，所有的中文字样全部变成乱码。
解决办法：在head标签中添加就行了。
3、在绘画结束后，页面当中并没有出现圆弧。
解决办法：分析实验后发现，是由于画板的宽高是在css中设置，导致圆弧发生了偏移，并且变形。把其改变成行内样式来设置就可以了。
