如何用html5 canvas 做饼图

html5 canvas 做饼图基本思路：

主要是利用HTML5 Canvas实现饼图绘制，绘制弧度的API主要是使用

context.arc与lineto两个API。

实现的功能有：

1. 支持标签Legend显示或者隐藏

2. 首次载入动画效果

3. 鼠标tooltip效果

4. 自定义饼图大小与是否添加文字

一提到插件，我们得需要了解它的一些配置属性，从官方得知共有10个属性，如下：

barColor

默认：#ef1e25

说明：指的是该curcular栏的颜色。你可以通过像RGB，RGBA十六进制或字符串颜色任一有效的CSS颜色字符串。 但你也可以通过接受目前的百分比值来返回一个动态生成的颜色的功能。

trackColor

默认：#f2f2f2

说明：轨道颜色。

scaleColor

默认：#dfe0e0

说明：刻度线的颜色。

lineCap

默认：round

说明：定义栏线的终点的形状。可能的值有： 对接，圆形和方形 。

lineWidth

默认：3

说明：中间轨道宽度。

size

默认：110

说明：饼图大小。规定为一个正方形。

animate

默认：false

说明：设置动画缓冲时间。

onStart

默认：$.noop

说明：动画开始回调函数。

onStop

默认：$.noop说明：动画结束回调函数。

onStep

默认：$.noop说明：动画过程中回调函数。

---