option = title text车辆所有权构成辆 leftcenter tooltip trigger item legend left right topcenter orientvertical formatter function name return $name$namevalue; 返回出图例所
要显示legend对应的value值,需要在formatter函数中添加name.value属性。修改后的代码如下:
option = {
title:{
text:'车辆所有权构成(辆)',
left:'center'
},
tooltip: {
trigger: 'item'
},
legend: {
left: 'right',
top:'center',
orient:'vertical',
formatter: function (name) {
return `${name}|${name.value}`; //返回出图例所显示的内容是名称+百分比
},
},
series: [
{
name: 'Access From',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: false,
fontSize: '40',
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: [
{ value: 32.6, name: '外租车辆' },
{ value: 67.4, name: '自有企业' },
]
},
// 就是这里!
{
name: '',
z: -1,
type: 'gauge',
radius: '-50%',
center: [`50%`, `50%`],
// 配置中间的数字
detail: {
// 调节数字位置
offsetCenter: [0, 20],
fontSize: 20,
},
pointer: {
show: false,
},
axisTick: {
show: false,
},
axisLine: {
show: false,
},
splitLine: {
show: false,
},
axisLabel: {
show: false,
},
// 中间的字和数字 数据
data: [
{
value: 180135,
name: '总计',
},
],
},
]
};
这样修改后,legend将显示为 "外租车辆|32.6" 和 "自有企业|67.4"。
原文地址: https://www.cveoy.top/t/topic/i9ms 著作权归作者所有。请勿转载和采集!