apache / apache/echarts

[Bug] Pie chart label background display is abnormal due to lineHeight

Open
#21,710 1 comment 0 reactions 0 assignees View on GitHub
bug en pending regression
Dominant language
TypeScript
Stars
67.3k
Forks
19.8k
Avg merge
11d 14h
Merged PRs (30d)
8

Description

### Version

6.1.0

### Link to Minimal Reproduction

https://echarts.apache.org/examples/zh/editor.html?c=pie-half-donut&code=bZBBq8IwDMfvforA49HLDhU33tjDg6jgXfQiO2RdnMXajq4qIn53u7FVD-sl6T-_JH9iaieNhjk8JwANWUlNBgefQ6e0zz1qyoDVkljUS4K0I-tBlvBfFkEX8qGqsCCVhX4vSE0bktXJZTBN-MABmBvZozJ3P76whOewAKBAca6suepyaZTxu9iPECIAryEp0eHguHMNN1RXb3jK4zQCjZfW_JbQihOsdeWtsE_3F_83SwK-kpaEG-eSlAdufUGpxrE4jQO20-2NF2Uzjs74Z-JelmR6tCfzLra_fPL6fwM&enc=deflate

### Steps to Reproduce

如果饼图的标签同时设置 { backgroundColor: 'any color' } 和 { overflow: 'break' } ,当标签的行高 lineHeight 太大时,标签背景的宽度会异常。

If the label of a pie chart is set with both { backgroundColor: 'any color' } and { overflow: 'break' } , when the lineHeight of the label is too large, the width of the label background will be abnormal.

Image

### Current Behavior

the width of the label background is too wide

### Expected Behavior

the width of the label background needs to fit label

### Environment

```markdown
- OS: win10
- Browser: Edge 150.0.4078.99
```

### Any additional comments?

_No response_

Contributor guide

Open the contributing guide

Research direction

Start with the linked minimal reproduction and inspect the pie chart label configuration using backgroundColor, overflow: 'break', and a large lineHeight. Trace how the label background dimensions are calculated, then verify that the background width fits the label at the reported settings and remains correct in the reproduction.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
data-visualization
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
68/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.