这里要介绍的是一个jQuery插件：jquery.easysector.js

Html5提供了强大的绘图API，让我们能够使用javascript轻松绘制各种图形。本文将主要讲解使用HTML5绘制饼图（统计图）的方法。先看一下饼图效果：

这个图是动态生成的，根据传入的比例参数（数组），来动态绘制饼图。饼图的大小也是根据<canvas>高度来动态调整的。

使用easysector插件的办法：

引用jquery库与jquery.easysector.js，在页面中防止一个div（例如：<div></div>）

然后使用js数组构造各项数据，然后执行easysector()方法，参数就是构造的数组与名称大小等项。

全部代码如下：

EasySector - HoverTree aEasySector jQuery PluginHoverTreeEasySector HomeHelpDemo 1NPMGithub 何问起 &copy; hovertree.com Array(); h_items[ { , , } h_items[ { , , } h_items[ { , , } h_items[ { , , } $().easysector({ : h_items, , , , , , , , , });

简洁代码请看：

更多特效：