drawLine () {
var that = this
window.addEventListener('resize', this.drawLine)
let myChart = this.$echarts.init(this.$refs.echarts)
var colors = ['rgba(18, 191, 255, 1)', 'rgba(33, 190, 132, 1)']
var
option = {
color: colors,
legend: {
orient: 'vertical',
right: '10%',
y: 'center',
itemGap: 30,
itemWidth: 12,
itemHeight: 12,
width: '100%',
textStyle: {
color: 'rgba(255, 255, 255, 1)',
fontSize: FontChart(14)
},
formatter: function (name) {
var data = option.series[0].data
var total = 0
var tarValue
for (var i = 0; i < data.length; i++) {
total += data[i].value
if (data[i].name == name) {
tarValue = data[i].value
}
}
var v = tarValue
var p = Math.round(((tarValue / total) * 100))
return `${name} \n ${p}%`
},
},
tooltip: {
trigger: 'item',
show: false,
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
series: [
{
name: '全域客流',
type: 'pie',
radius: ['60%', '80%'],
center: ['30%', '50%'],
minShowLabelAngle: 0,
label: {
normal: {
show: false,
position: 'center',
fontSize: FontChart(14),
color: 'auto',
formatter: (params) => {
return params.value + '\n' + params.name
},
},
emphasis: {
show: false,
position: 'center',
fontSize: FontChart(14),
color: 'auto',
formatter: function (value, index) {
console.log(value)
return '{label|' + value.percent + '%}\n'
+ '{value|' + value.name + '}'
},
rich: {
label: {
padding: 0,
align: 'center',
verticalAlign: 'middle',
fontSize: FontChart(16),
color: 'rgba(0, 255, 255, 1)',
fontFamily: 'Helvetica Condensed Bold'
},
value: {
align: 'center',
color: '#fff',
padding: [0, 0, 10, 0],
fontSize: FontChart(14),
verticalAlign: 'middle',
},
},
},
},
labelLine: {
length: 1,
length2: 20,
show: false
},
data: [{
name: '社保卡结借阅占比',
value: 100,
itemStyle: {
normal: {
borderWidth: 2,
borderColor: '#133CE0',
color: new this.$echarts.graphic.LinearGradient(
0, 0, 0, 1,
[
{
offset: 0,
color: 'rgba(33, 190, 132, 1)'
},
{
offset: 1,
color: 'rgba(55, 226, 163, 1)'
}
]
)
}
}
}, {
name: '其余借阅占比',
value: 100,
itemStyle: {
normal: {
borderWidth: 2,
borderColor: '#133CE0',
color: new this.$echarts.graphic.LinearGradient(
0, 0, 0, 1,
[
{
offset: 0,
color: 'rgba(18, 191, 255, 1)'
},
{
offset: 1,
color: 'rgba(18, 224, 255, 1)'
}
]
)
}
}
}]
}
]
}
myChart.clear()
myChart.resize()
myChart.setOption(option)
},