initToolBox:function(domId){
var level1='#66d0e3'
var level2='#46d481'
var level3='#b4b2ef'
var level4='#f7bf65'
var level5='#fdef0b'
let that=this
var legend=[]
/* this.levelRows.forEach(item=>{
legend.push(item.name)
}) */
let PIE1 = echarts.init(document.getElementById(domId));
var option = {
graphic: {
elements: [{
type: 'image',
style: {
image: '<%=path%>/oap/images/sysHomePageNew/pie-center.png',
width: 90,
height: 90
},
left:'49%',
top:'74'
}]
},
backgroundColor: '#f4ffe1',
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend: {
orient: 'vertical',
x: 'left',
left:'20',
top:'7%',
itemGap:30,
itemWidth:14,
data:['应用','数据库','中间件','操作系统','网络'],
textStyle: {
color: '#36699d'
}
},
series: [
{
name:'面积模式',
type:'pie',
radius : [50, 70],
center : ['60%', '50%'],
roseType : 'area',
color: [level1,level2,level3,level4,level5],
data:[{value:33, name:'应用'},
{value:31, name:'数据库'},
{value:23, name:'中间件'},
{value:13, name:'操作系统'},
{value:18, name:'网络'}]
}
]
};
PIE1.setOption(option);
}
最终图片