通过比较，看起来ECharts.js更容易上手，但是因为我需要更灵活更符合个性定制化的工具，所以选了d3.js。
经过一段时间的磨炼，从折线图、闭合路径图、蜂窝图、直角坐标、极坐标都玩了个遍。
那这次就来个3D的吧，其实d3.js做3D的图不是很容易的，有更好的选择，但我认准了d3.js，一条道走到黑吧(想起高中数学老师说的话，当你解题解到一半时发现有更好的办法，不，赶紧忘掉，接着当前的方法，只要方法没错，总能解出来，也许会傻一点，但是一定会有正确的结果；如果中途放弃，也许另一个方法更快更聪明，但也许更慢或者错误，不算到最后，谁都不知道谁最准确。我选择相信他的话，于是。。。我成了程序员O(∩_∩)O哈哈~)。
有人鄙视拿来主义，要我说，你能拿来那是你的本事，如果还能在此基础上做出更好的东西，何乐而不为呢？
每个人时间有限，每个项目也有deadline，不可能从每一个螺丝钉怎么拧开始学起，不然怎么会有那么多五花八门的框架，会有封装好的组件和接口，正因为有人已经做了前期工作，所以时间才能省下来做更有意义的事情，这就是站在巨人肩上的道理所在吧。
但是我们得明白拿来的东西的原理，以及出了问题该怎么解决的能力。然后才能做出更厉害的东西。
首选当然是官网的例子咯，目测搜了一圈，终于找到一个3D Donut。就是你了，我的巨人。
把该地址的donut3d.js拷贝下来作为画3D饼图的基础js，待会会在此基础上修改，以满足我的要求(长的像齿轮的要求)。
那我们就一睹她的芳容吧。
如果这张图符合你的要求，那就打住，不用往下看了，直接看官网例子即可。
注意d3版本的问题，如果你用d3.v3.js，恭喜你，啥也不用改，直接拿来用；如果你用d3.v5.js，那稍微改下方法，比如d3.v5.js没有d3.layout，所以d3.layout.pie改成d3.pie。我就是那个不幸的人，用的d3.v5.js。没关系，改起来很快，运行下，看哪里有错，就改哪里，O(∩_∩)O哈哈~so easy！
还是先上个我已经改好之后的3D饼图(齿轮图)吧，方便说明。
其实显示的时候是个动态的，一节一节显示出齿轮的。
背景是黑乎乎的，据说现在流行黑乎乎的背景，显得有科技感，技术也要赶时髦啊，我这么fashion的人，做出来的东西也要fashion啊O(∩_∩)O~
从以上分析可以看出，难啃的骨头在第4点。这个图断断续续花了3天时间才搞定，为啥是断断续续呢，因为还有其他工作要做嘛，你懂得。
那就按顺序一条一条实现，总有一天我们的愿望都能实现！
首先新建svg及设置宽高。
我是切分成了32个小齿轮(包含透明的)，如果你想分的更细，可以分成40或50个，只要你觉得好看就行。
既然要分成32个小立体快，那数据也要切分成32个。
通过以上处理，把数据整合成可以生成齿轮的完整数据dataset。
如果不增加左侧面和右侧面，那调用donut3d.js的draw方法后，会生成什么样的图形呢？
请各位仔细看。
是不是有种被掏空的感觉？如果你觉得这样挺好看，那也行，打住吧，后面就不用再看了；如果你想补齐其他面，请耐心往下看。
经过观察和比较，增加左侧面和右侧面就能填满空虚的心啦啦啦～
这次要在donut3d.js这个巨人身上添砖加瓦咯。
然后再用新增加的两个方法画出左右侧面。
终于填满需要的每一面，看上去像个立体齿轮图了。
这个图是很久之前做的，当时花了很长时间调试，每一个面有4条边，定位2个点，再加上高度和内半径，就可以计算出4个点，然后就可以画出4条边，最后填充颜色，一个面就完成了。
最近整理文档时觉得有必要写出来，方便以后查阅和探讨，也告诉自己积累是一个长期过程，不急不躁，慢慢来，一步一步完成既定目标，总有一天你会走遍技术的每个角落。
现在我整理成vue组件，传一个百分比的参数，就可以显示3D齿轮图了，我的3D齿轮图也成巨人啦。
在Excel中插入饼图时有时会遇到这种情况，饼图中的一些数值具有较小的百分比，将其放到同一个饼图中难以看清这些数据，这时使用复合条饼图就可以提高小百分比的可读性。
复合饼图（或复合条饼图）可以从主饼图中提取部分数值，将其组合到旁边的另一个饼图（或堆积条形图）中。
例如下面的饼图显示了某杂志的读者职业分布情况，其中小百分比数据较为密集不易看清楚。
而改用复合条饼图就显得一目了然。
有时还需要强调饼图中的一组数值，这时就可以使用复合饼图或复合条饼图，如下例为某些产品在几个城市的销售情况，第二个表格为“广州”的销售数据。
用复合饼图可以突出显示“广州”的详细销售情况。
下面以上表为例介绍复合饼图的制作方法，复合条饼图的制作方法类似。
首先，为了制作复合饼图，需要将上表中的数据进行重新组合，将数值放到同一行或同一列中，如下图中底部的表格：
Excel 2003：
1.选择重新组合后表格中的某个单元格，如B9单元格，单击菜单“插入→图表”，在“图表向导”对话框中选择“饼图”，“子图表类型”选择“复合饼图”。
单击“完成”按钮。
2.删除右侧的图例，双击图表中的数据系列，弹出“数据系列格式”对话框，选择“数据标志”选项卡，勾选“类别名称”和“值”。
选择“选项”选项卡， 可以看到“分割系列”默认选择的是“位置”，表示表格最后的几个数值将被放到次饼图中，具体的数量通过调整“第二绘图区包含最后”右侧的数值来确定，本例中由于有4个数值（“广州”的4个销售数据）需在次饼图中显示，这里改为“4”。
另外，调整“第二绘图区的尺寸”来调整次饼图的大小，这里改为“70”，即次饼图的尺寸为主饼图的“70%”。
“分割系列”选项除“位置”外，还有其他几个选项，含义如下：
数值：图表中的数据系列数值小于指定数值时放到次饼图中。
百分比值：图表中的数据系列数值小于指定百分比时放到次饼图中。
自定义：可以将某个数据系列数值从主饼图中拖入到次饼图中，反之亦然。实际上，“分割系列”无论为上述哪个选项，都可以在两个饼图之间拖动某个数据系列数值，拖动后“分割系列”会自动被设置为“自定义”。
单击“确定”。
将图表中的“其他”修改为“广州”，方法如下：单击“其他，3645.17”，这时整个数据标志都被选中，再次单击“其他，3645.17”，单独选中该数据标志。将“其他”改为“广州”。
将光标定位到数值“3645.17”前按回车键让该数据标志显示为两行，并将其拖到到适当的位置。调整其他数据标志的位置和绘图区的大小，最后完成图表。
Excel 2007/2010：
下面以Excel 2010为例来进行说明，Excel 2007中的操作方法类似。
1.选择重新组合后表格中的某个单元格，如B9单元格，在功能区中选择“插入”选项卡，在“图表”组中单击“饼图→复合饼图”。
2.删除右侧的图例，双击图表中的数据系列，弹出“设置数据系列格式”对话框（在Excel 2007中需右击数据系列，然后在快捷菜单中选择“设置数据系列格式”），将“第二绘图区包含最后一个”右侧的数值改为“4”，调整第二绘图区的大小，然后关闭对话框。
当“系列分割依据”选择“自定义”时，可以将某个数据点任意放置到主饼图或次饼图中。方法是选择某个数据点，在“点属于”右侧的下拉列表中选择放置的位置。
3.在图表的数据系列中右击，选择“添加数据标签”。双击图表中添加的数据标签，弹出“设置数据标签格式”对话框，在“标签选项”中勾选“类别名称”，然后关闭对话框。
4.将图表中的“其他”数据标志改为“广州”，方法同上。
5.要进一步美化图表，可以在“图表工具-设计”选项卡中的“样式”组中选择某种样式，如本例选择“样式26”。
复合条饼图的制作方法。
可按照以下步骤进行。1.打开数据表。
2.选中数据区,点击插入,其他图表,圆环图。
3.点击里面的圆环,也就是系列1月,点击设计,更改图表类型,弹出对话框,点击饼图,复合饼图,确定。
4.在饼图上右击,点击设置数据系列格式。
5、弹出对话框，把第二绘图区包含最后一个后的数据高到最大，系列绘制在次坐标轴。再调整第二绘图区大小，这是为了选取系列2方便。确定。点击系列2，更改为复合饼图。
6、在系列2饼图上右击，点击设置系列数据格式，弹出对话框，把第二绘图区包含最后一个后的数值调到最小，关闭。
7、选中系列1，右击，点击设置数据点格式。
8、弹出对话框，点击填充，无填充。
9、点击边框颜色，无线条。关闭。
10、删除系列线，图例。
11、调整好两个饼图的大小，添加上数据标签，标题。在一张图表中制作两个饼图制作完成。
