用canvas绘制一个饼状图

Canvas，网页原来是可以画出来的…

认识Canvas
Canvas绘制矩形
Canvas绘制圆形
使用moveTo()和lineTo()绘制路径
Canvas绘制一个饼状图
认识Canvas
HTML5 标签用于绘制图像（通过脚本，通常是 JavaScript）。

不过， 元素本身并没有绘制能力（它仅仅是图形的容器） - 必须使用脚本来完成实际的绘图任务。
getContext() 方法可返回一个对象，该对象提供了用于在画布上绘图的方法和属性。
在页面放置一个canvas元素，就相当于放置了一个画布，可以在其中进行图形的绘制。但绘制图形，并不是指使用鼠标作画，而是需要javascript进行配合。创建canvas的时候，他默认的宽高为300px*150px。
Canvas的 getContext(“2d”) 对象的属性和方法，可用于在画布上绘制文本、线条、矩形、圆形等等。

<canvas id="canvas">我是一个画布</canvas>

​​​Canvas绘制矩形
我们在HTML页面中直接插入canvas标签，也可以对它设置宽度和高度，切记设置canvas的时候不可以利用css样式进行设置。那么，我们想在canvas上面画出矩形，我们就需要认识以下几种api。

方法 描述
getContext() 获取绘图环境，可选参数"2d"
fillRect(x,y,width,height) 绘制一个填充的矩形