效果图:
实现代码:
function getPieOption (data) {
var imageArr = [
'./img/officeSupplies_04.gif',
'./img/officeSupplies_06.gif'
];
if (!data[0]) imageArr[0] = '';
if (!data[1]) imageArr[1] = '';
var seriesData = [
{
value: data[0],
name: '办公固定资产',
label: {
formatter: [
' {image|}'
].join('\n'),
position: 'inner',
rich: {
image: {
height: 25,
backgroundColor: {
image: imageArr[0]
}
}
}
}
},
{
value: data[1],
name: '重点低质易耗品',
label: {
formatter: [
' {image|}'
].join('\n'),
position: 'inner',
rich: {
image: {
height: 20,
backgroundColor: {
image: imageArr[1]
}
}
}
}
}
];
return option = {
tooltip: {
trigger: 'item',
orient: 'horizontal',
x: 'center',
y: 'bottom',
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
legend: {
orient: 'horizontal',
left: 'center',
top: 'bottom',
data: ['办公固定资产', '重点低质易耗品']
},
grid: {
top: '3%',
left: '3%',
right: '3%',
bottom: '3%',
containLabel: true
},
color: ['#87bdfb', '#a49ef8'],
series: [
{
name: '办公物资存量',
type: 'pie',
radius: '70%',
center: ['50%', '40%'],
data: seriesData,
emphasis: {
itemStyle: {
borderColor: '#fff',
borderWidth: 2,
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
},
itemStyle:{
borderWidth:2,
borderColor:'#fff',
}
}
]
};
}
调用:
var assetsLChart = echarts.init(document.getElementById('assetsLChart'));
assetsLChart.setOption(getPieOption([335, 250]));