VChart
VChart copied to clipboard
VisActor
[Bug] 配置tooltip选项 label 回自动折行
Version
1.6.5
Link to Minimal Reproduction
https://codesandbox.io/p/sandbox/proud-firefly-dhggr4?file=%2Fsrc%2Findex.ts
Steps to Reproduce
复制配置到图表hover 出现 tooltip 就能看到 (Copy the configuration to the chart, hover to display the tooltip to see.)
{
"type": "pie",
"percent": false,
"tooltip": {
"minWidth": 120,
"style": {
"spaceRow": 6,
"keyLabel": {
"lineHeight": 20,
"fontSize": 12,
"fontColor": "#646A73",
"textAlign": "left",
"maxWidth": 300,
"wordBreak": "initial",
"multiLine": true
},
"valueLabel": {
"lineHeight": 20,
"fontSize": 12,
"fontColor": "#646A73",
"maxWidth": 300,
"multiLine": true,
"wordBreak": "initial"
},
"titleLabel": {
"fontSize": 12,
"lineHeight": 20,
"fontWeight": 400,
"fontColor": "#1F2329",
"maxWidth": 300,
"multiLine": true
},
"panel": {
"padding": {
"top": 10,
"bottom": 10,
"left": 12,
"right": 12
},
"border": {
"color": "#EFF0F1",
"width": 1,
"radius": 6
},
"shadow": {
"x": 0,
"y": 4,
"blur": 16,
"spread": 4,
"color": "#1F232908"
}
},
"shape": {
"size": 8,
"spacing": 6,
"shapeSize": 8
}
}
},
"data": {
"values": [
{
"channel_type": "电商平台2312343214321432111111234143电商平台2312343214321432111111234143电商平台2312343214321432111111234143电商平台2312343214321432111111234143电商平台2312343214321432111111234143电商平台2312343214321432111111234143电商平台2312343214321432111111234143电商平台2312343214321432111111234143",
"amount": 262
},
{
"channel_type": "自有网站",
"amount": 282
},
{
"channel_type": "微信小程序",
"amount": 311
},
{
"channel_type": "实体门店门店门店",
"amount": 350
},
{
"channel_type": "电话订购23门店",
"amount": 400
}
]
},
"valueField": [
"amount"
],
"categoryField": [
"channel_type"
],
}
Current Behavior
出现 tooltip 不符合预期的换行。虽然是用的是 1.6.5 版本，在官网示例中最新版本也会出现。（The tooltip line break does not meet expectations. Although I am using version 1.6.5, the latest version on the official website also has this issue.）
Expected Behavior
popover 正常包裹，或者不换行
Environment
- OS: mac
- Browser: chrome
- Framework: front-end React
Any additional comments?
希望尽快解决，谢谢🙏 （Hope to solve it as soon as possible , thanks）
