Html5提供了强大的绘图API，让我们能够使用javascript轻松绘制各种图形。本文将主要讲解使用HTML5绘制饼图（统计图）的方法。先看一下饼图效果：
工具/原料
关键词：html5,js,canvas,arc()
方法/步骤
1
html代码，canvas容器：
2
js代码，画圆JavaScript 语法：context.arc(x,y,r,sAngle,eAngle,counterclockwise);x圆的中心的 x 坐标。y圆的中心的 y 坐标。r圆的半径。sAngle起始角，以弧度计（弧的圆形的三点钟位置是 0 度）。eAngle结束角，以弧度计。counterclockwise可选。规定应该逆时针还是顺时针绘图。False = 顺时针，true = 逆时针。通过计算开始弧度sAngle,结束弧度eAngle,f进行画弧度，填充不同的颜色，即可画饼图。
注意事项
1
arc() 方法创建弧/曲线（用于创建圆或部分圆）。
2
如需通过 arc() 来创建圆，请把起始角设置为 0，结束角设置为 2*Math.PI。
3
请使用 stroke() 或 fill() 方法在画布上绘制实际的弧。
4
弧的圆形的三点钟位置是 0 度，即水平右边为0度