This commit is contained in:
shijingjing
2022-07-13 16:59:58 +08:00
parent 1a0d42890d
commit 0b7ae25121
4 changed files with 372 additions and 58 deletions

View File

@@ -55,9 +55,6 @@
</div>
<div id="columnarEcharts"></div>
</div>
<div class="pieEcharts">
<div id="pieEcharts"></div>
</div>
<u-popup v-model="filterShow" mode="bottom">
<div class="popup">
@@ -99,7 +96,6 @@ export default {
brokenEcharts2: null,
brokenEcharts3: null,
columnarEcharts: null,
pieEcharts: null,
filterShow: false,
}
},
@@ -112,7 +108,6 @@ export default {
this.getBrokenEcharts2()
this.getBrokenEcharts3()
this.getColumnarEcharts()
this.getPieEcharts()
},
methods: {
showMore() {},
@@ -319,46 +314,7 @@ export default {
]
})
},
// 带百分比饼图
getPieEcharts() {
this.pieEcharts = echarts.init(document.getElementById('pieEcharts'))
this.pieEcharts.setOption( {
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b}: {c} ({d}%)'
},
color:['#1684fc','#ccc'],
series: [
{
name: '群发送达率',
type: 'pie',
radius: ['60', '70%'],
avoidLabelOverlap: false,
label: {
normal: {
show: false,
position: 'center'
},
},
labelLine: {
show: false
},
data: [
{value: 10, name: '群发送达率', label:{
normal:{
show:true,
formatter: '{d}%\n群发送达率',
textStyle: {
fontSize: 16,
},
}}
},
{value: 120, name: '邮件营销'}
]
}
]
})
}
}
}
</script>
@@ -464,21 +420,18 @@ export default {
}
.brokenEcharts,
.columnarEcharts,
.pieEcharts {
.columnarEcharts {
background: #FFF;
#brokenEcharts1,
#brokenEcharts2,
#brokenEcharts3,
#columnarEcharts,
#pieEcharts {
#columnarEcharts {
width: 100%;
height: 400px;
background: #F9F9F9;
border-radius: 8px;
}
}
.popup{
@@ -555,4 +508,4 @@ export default {
}
}
</style>
</style>