electricCarTypeChart () {
let _this = this;
let myChart = this.$echarts.init(this.$refs.electricCarTypeChart);
let option = {
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
color: ['#1890FF', '#2FC15A', '#FACC14', '#F04864', '#8544E0', '#14C2C3'],
legend: {
type: 'scroll',
orient: 'vertical',
icon: 'circle',
right: 0,
top: 0,
bottom: 0,
padding: 5, // [5, 10, 15, 20]
itemGap: 10,
itemWidth: 8,
itemHeight: 8,
pageIconSize: 10,
data: ['电动自行车', '电动摩托车', '电动三轮车', '电动四轮车', '电动滑板车', '电动平衡车', '老年代步车', '电动轻便摩托车'],
formatter: function (params) {
var total = 0;
for (var i = 0; i < option.series[0].data.length; i++) {
total += option.series[0].data[i].value;
}
for (var j = 0; j < option.series[0].data.length; j++) {
if (option.series[0].data[j].name === params) {
var ePercent = 0;
if (total !== 0) {
ePercent = (option.series[0].data[j].value / total * 100).toFixed(2);
}
return params + ' {a|' + option.series[0].data[j].value + '} ' + ePercent + '%';
}
}
},
textStyle: {
rich: {
a: {
fontWeight: 'bold'
}
}
}
},
calculable: true,
series: [
{
name: '销售金额',
type: 'pie',
radius: ['25%', '60%'],
center: ['20%', '50%'],
roseType: 'area',
avoidLabelOverlap: false,
label: {
normal: {
show: false,
position: 'center'
},
emphasis: {
show: true,
textStyle: {
fontSize: '14',
fontWeight: 'bold'
}
}
},
data: [
{value: 4463920, name: '电动自行车'},
{value: 3560658, name: '电动摩托车'},
{value: 3076815, name: '电动三轮车'},
{value: 2884912, name: '电动四轮车'},
{value: 2510971, name: '电动滑板车'},
{value: 2203322, name: '电动平衡车'}
]
}
]
};
myChart.setOption(option);
myChart.resize();
window.onresize = function () { // 用于使chart自适应高度和宽度
myChart.resize();
};
return {
refresh: function (option) {
myChart.setOption(option);
},
option: option
};
}