产品的需求
产品的需求是达到这样的效果：
image
该图标采用的是eCharts，但是eCharts中没有这样的demo显示，需要做对应的修改与调整；具体实现代码：
/**
* 初始化图表
* */
initEcharts(){
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('echarts-main'));
// 指定图表的配置项和数据
var option = {
color:['#4547b6','#4dbeff', '#51f1f1', '#1ae7b0', '#f7da36','#f9a137', '#dd4544', '#bda29a','#6e7074', '#546570', '#c4ccd3'], // 每一个饼状图的颜色
series: [
{
name:'访问来源',
type:'pie',
radius : '50%',
center: ['50%', '70%'],
data: this.storeGradeRankDataList, // 展示的数据源
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
},
normal:{
label:{
show: true,
formatter: '{b} : {c}' // 展示具体数值，b：展示数据的名称； c：展示数据的值
},
labelLine :{show:true} // 是否显示线
}
}
}
],
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
},
