Javascript 如何使用E pie div元素创建圆？

我试图用html和css复制这个图表

…但却做不到。我想创建六个饼片，在圆的中心有一个标志。在每个饼图切片上，将有一个带有文本的图像和一个适当的悬停工具提示。当饼图切片处于活动状态时，其颜色必须为红色

---

谁能帮我复制一下这个吗？

你可以试试这个

动画圆形菜单演示
html，
身体{高度：100%；}
身体{
保证金：0；
背景：线性梯度（#eeeeee，#cccc）；
溢出：隐藏；
}
.选择器{
位置：绝对位置；
左：50%；
最高：50%；
宽度：140px；
高度：140像素；
利润上限：-70px；
左边距：-70px；
}
.选择器，
.选择器按钮{
字体系列：“Oswald”，无衬线；
字体大小：300；
}
.选择器按钮{
位置：相对位置；
宽度：100%；
身高：100%；
填充：10px；
背景：#428bca；
边界半径：50%；
边界：0；
颜色：白色；
字体大小：20px；
光标：指针；
长方体阴影：0 3px 3px rgba（0,0,0,0.1）；
过渡：全部1秒；
}
.选择器按钮：悬停{背景：#3071a9；}
.selector按钮：焦点{大纲：无；}
.选择器ul{
位置：绝对位置；
列表样式：无；
填充：0；
保证金：0；
顶部：-20px；
右：-20px；
底部：-20px；
左：-20px；
}
李先生{
位置：绝对位置；
宽度：0；
身高：100%；
利润率：0.50%；
-webkit变换：旋转（-360度）；
过渡：所有0.8秒都易于输入输出；
}
.li选择器输入{显示：无；}
.选择器li输入+标签{
位置：绝对位置；
左：50%；
底部：100%；
宽度：0；
身高：0；
线高：1px；
左边距：0；
背景：#fff；
边界半径：50%；
文本对齐：居中；
字号：1px；
溢出：隐藏；
光标：指针；
盒影：无；
过渡：所有0.8秒缓进缓出，颜色0.1秒，背景0.1秒；
}
.selector li输入+标签：悬停{背景：#f0；}
.选择器li输入：选中+标签{
背景：#5cb85c；
颜色：白色；
}
.selector li输入：选中+标签：悬停{背景：#449d44；}
.选择器.打开li输入+标签{
宽度：80px；
高度：80px；
线高：80px；
左边距：-40px；
长方体阴影：0 3px 3px rgba（0,0,0,0.1）；
字体大小：14px；
}
动画圆形菜单演示


菜单1


菜单2


菜单3


菜单4


菜单5


菜单6


菜单7


菜单8


单击以切换菜单
var nbOptions=8；
var angleStart=-360；
//jquery旋转动画
函数旋转（li，d）{
$（{d:angleStart}）。设置（{d:d}）动画{
步骤：功能（现在）{
$（李）
.css（{transform:'rotate（'+now+'deg）}）
.find（'标签'）
.css（{transform:'rotate（+-now）+'deg）}）；
}，持续时间：0
});
}
//显示/隐藏选项
功能切换选项{
$（s）.toggleClass（'open'）；
var li=$（s）.find（'li'）；
var deg=$（s）.hasClass（'half'）？180/（li.length-1）：360/li.length；
对于（var i=0；我看一看这个答案：它现在是满的，没有悬停，我不能把标志放在圆圈的中心，任何人都可以帮助我