南丁格尔玫瑰图-修改扇形块的颜色与玫瑰图添加图片与文字

背景：1.依据要求给扇形图分配不同颜色

    2.在玫瑰图中间插入数字或图片

效果图：

如上一篇所述，首先要给图表一个具备宽高的容器；

HTML:

先说扇形块的颜色分配，代码片段如下图

红色框内data是组成南丁格尔玫瑰图的数据；

黄色框内即是组成扇形模块的颜色，颜色将根据饼图的区域个数进行循环；

模块添加颜色之后；会发现显示数据的文字的颜色也随着改变；与扇形模块的颜色一致；因此需要对此进行设置；可以依据自己的要求统一修改文字颜色，代码如蓝框内容。

接下来简单说下饼图中间空白区域的文字与图片添加问题；

graphic 是原生图形元素组件。可以支持的图形元素包括： image, text, circle, sector, ring, polygon, polyline, rect, line, bezierCurve, arc, group，可以从echarts官网中配置项查阅到更加具体的内容。

图形元素为图片：（具体可以看注释喔~~）

最后贴上js的源码：

欢迎补充~~