echart添加⽂本_Echarts饼图中间添加⽂字、title、graphic Echarts 的饼图中间添加⽂字说明 ,主要使⽤graphic、title来完成配置,效果图如下:
image.png
直接上代码:
// 指定图表的配置项和数据
var option = {
tooltip: {
trigger: 'item',
formatter: "{a}
{b}: {c} ({d}%)"
},
color:["#27D9C8","#D8D8D8"],
title:{
text:"80%",
left:"center",
top:"50%",
textStyle:{
color:"#27D9C8",
fontSize:36,
align:"center"
}
},
graphic:{
type:"text",
left:"center",
top:"40%",
style:{
text:"运动达标率",
textstyletextAlign:"center",
fill:"#333",
fontSize:20,
fontWeight:700
}
},
series: [
{
name: '运动情况',
type: 'pie',
radius: ['65%', '70%'], avoidLabelOverlap: false, label: {
normal: {
show: false,
position: 'center'
},
},
data: [
{ value: 80, name: '已完成' }, { value: 20, name: '未完成' }, ]
}
]
};

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。