templete中
<div ref="hazardratio" style="width:99%;height:260px;" ></div>
data中
data () {
return {
chart: null,
data: [],
pielegend: ['暫無數(shù)據(jù)'],
pieseriedata: [
{ value: 0, name: '暫無數(shù)據(jù)' }
]
}
},
methods中
piechart (pielegend, pieseriedata) {
return {
tooltip: {
trigger: 'item',
formatter: '{a} <br/>洲劣 : {c} (wxdn1nz%)'
},
legend: {
orient: 'vertical',
y: '92%',
data: pielegend
},
series: [
{
center: ['50%', '45%'],
name: '隱患類別',
type: 'pie',
radius: '75%',
label: {
normal: {
show: true,
// position: 'inside',
formatter: '临燃tg7attx%', // 模板變量有 {a}弥喉、巍糯、{c}选酗、y7tes6h，分別表示系列名舅列，數(shù)據(jù)名肌割，數(shù)據(jù)值，百分比帐要。ao2lqqg數(shù)據(jù)會根據(jù)value值計算百分比
textStyle: {
align: 'center',
baseline: 'middle',
fontFamily: '微軟雅黑',
fontSize: 15,
fontWeight: 'bolder'
}
}
},
data: pieseriedata,
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
}
}
mounted中
this.$nextTick(() => {
this.chart = echarts.init(this.$refs.hazardratio)
var that = this
this.chart.setOption(that.piechart(that.pielegend, that.pieseriedata))
// on(window, 'resize', this.resize)
})
