[Bug] 饼图图例切换导致计算错误

[lihuihui8787]

Version

5.4.0

Link to Minimal Reproduction

No response

Steps to Reproduce

option = {
tooltip: {
trigger: 'item'
},
toolbox: {
feature: {
saveAsImage: {
title: '保存为图片'
}
}
},
legend: {
show: true,
bottom: 0
},
grid: {
top: '10%',
bottom: '10%'
},
series: [
{
name: '污染强度占比',
type: 'pie',
radius: '50%',
data: [
{
name: '一级',
value: 105,
itemStyle: {
color: '#00e400'
}
},
{
name: '二级',
value: 12,
itemStyle: {
color: '#ffff00'
}
},
{
name: '三级',
value: 0,
itemStyle: {
color: '#ff7e00'
}
},
{
name: '四级',
value: 0,
itemStyle: {
color: '#ff0000'
}
},
{
name: '五级',
value: 0,
itemStyle: {
color: '#99004c'
}
},
{
name: '六级',
value: 0,
itemStyle: {
color: '#7e0023'
}
}
],
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)',
normal: {
label: {
show: true,
formatter: (val) => {
return val.name + '：' + (val.percent ? val.percent : 0) + '%';
},
//展示的文字 类型+百分比
fontWeight: 600
},
labelLine: { show: true, lineStyle: { width: 2, color: '#000' } }
}
}
}
]
};

Current Behavior

切换图例会导致百分比数据显示错位

Expected Behavior

切换图例百分比数据显示正确

Environment

- OS: macOS
- Browser: 106.0.5249.103（正式版本） (arm64)
- Framework: Vue@2

Any additional comments?

与操作系统无关，只有5.4.0版本会有此问题，降级到5.4一下的版本没有问题了

[echarts-bot]

@lihuihui8787 It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people and get helped, we'd like to suggest using English next time. 🤗

TRANSLATED

TITLE

[Bug] Pie chart legend switching results in a calculation error

BODY

Version

5.4.0

Link to Minimal Reproduction

No response

Steps to Reproduce

option = {
tooltip: {
trigger: 'item'
},
toolbox: {
feature: {
saveAsImage: {
title: 'Save as image'
}
}
},
legend: {
show: true,
bottom: 0
},
grid: {
top: '10%',
bottom: '10%'
},
series: [
{
name: 'Proportion of pollution intensity',
type: 'pie',
radius: '50%',
data: [
{
name: 'Level 1',
value: 105,
itemStyle: {
color: '#00e400'
}
},
{
name: 'Secondary',
value: 12,
itemStyle: {
color: '#ffff00'
}
},
{
name: 'Level 3',
value: 0,
itemStyle: {
color: '#ff7e00'
}
},
{
name: 'Level 4',
value: 0,
itemStyle: {
color: '#ff0000'
}
},
{
name: 'Level 5',
value: 0,
itemStyle: {
color: '#99004c'
}
},
{
name: 'Level 6',
value: 0,
itemStyle: {
color: '#7e0023'
}
}
],
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)',
normal: {
label: {
show: true,
formatter: (val) => {
return val.name + ':' + (val.percent ? val.percent : 0) + '%';
},
//display text type + percentage
fontWeight: 600
},
labelLine: { show: true, lineStyle: { width: 2, color: '#000' } }
}
}
}
]
};

Current Behavior

Toggle legend causes percentage data to display misplaced

Expected Behavior

Toggle legend percentage data display correctly

Environment

- OS: macOS
- Browser: 106.0.5249.103 (official version) (arm64)
- Framework: Vue@2

Any additional comments?

It has nothing to do with the operating system. Only version 5.4.0 will have this problem. There is no problem with downgrading to versions below 5.4.

[plainheart]

#17734 已修复该问题，参见 #17732。