使用纯css制作扇形图，合并起来形成饼图：
应该知道css3中引入了圆角属性（border-radius），一旦设置这个值，边框即会出现圆角。同样，我们对正方形设置圆角，即可得到饼状图
html：<div id="circle">11</div>
css：
#circle{
width:0
height:0
border-radius:100px
border-width:100px
border-style:solid
border-color: red blue green yellow
line-height:99em
overflow:hidden
cursor:pointer
margin: 30px auto
}
效果：
4.同样我们对其中三个边框设置透明色即可得到扇形
html：<div id="fan">11</div>
css:
#fan{
width:0
height:0
border-radius:100px
border-width:100px
border-style:solid
border-color:red transparent transparent transparent
line-height:99em
overflow:hidden
cursor:pointer
margin: 30px auto
}
效果：
用html的svg+css3绘制，比js方便！下面是个简单的例子
<?xml version="1.0" standalone="no" ?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "
<svg width="400" height="400">
<path d="M200,200 L200,20 A180,180 0 0,1 377,231 z" style="fill:#ff0000 fill-opacity: 1 stroke:black stroke-width: 1"/>
<path d="M200,200 L377,231 A180,180 0 0,1 138,369 z" style="fill:#00ff00 fill-opacity: 1 stroke:black stroke-width: 1"/>
<path d="M200,200 L138,369 A180,180 0 0,1 20,194 z" style="fill:#0000ff fill-opacity: 1 stroke:black stroke-width: 1"/>
<path d="M200,200 L20,194 A180,180 0 0,1 75,71 z" style="fill:#ff00ff fill-opacity: 1 stroke:black stroke-width: 1"/>
<path d="M200,200 L75,71 A180,180 0 0,1 200,20 z" style="fill:#ffff00 fill-opacity: 1 stroke:black stroke-width: 1"/>
</svg>
在word2003编制栏中选择—插入—图形——出现条状统计表，将鼠标放于图表类点击鼠标右键——选择 图表类型— 饼图 就出来了；
word中所有的图形统计都是一样的，你先将表格数据做好，在行插入图形统计就会按照你打的数据显示，然后你需要调整哪些地方就直接点击那里。
调节好饼状图大小，双击饼状图数据系列，打开数据系列格式对话框，选定图案标签，可以确定饼状图的颜色，单击坐标轴标签，可以主坐标轴和次坐标轴，数据标签和选项标签可以设置一些其它内容。现在饼状图就制作好了。
