Closed
Description
Version
5.2.2
Link to Minimal Reproduction
No response
Steps to Reproduce
option = {
title: [
{
text: '安装趋势',
left: '5%',
top: '50%',
textStyle: { color: '#fff' },
textAlign: 'center'
},
{
text: '安装率',
subtext: '总计 1783',
left: '5%',
textStyle: { color: '#fff' },
subtextStyle: { color: '#fff' },
textAlign: 'center'
}
],
color: ['#1F7BE5', '#FFD700'],
tooltip: [
{
trigger: 'item',
formatter: '{b} : {c} ({d}%)'
},
{ trigger: 'item' }
],
legend: {
textStyle: { color: '#fff' },
top: '%'
},
grid: {
left: '0%',
top: '60%',
right: '0%',
bottom: '0%',
containLabel: true
},
xAxis: [
{
type: 'category',
axisLabel: { textStyle: { color: '#fff' } },
data: [
'12-01',
'12-02',
'12-03',
'12-04',
'12-05',
'12-06',
'12-07',
'12-08',
'12-09',
'12-10',
'12-11',
'12-12',
'12-13',
'12-14',
'12-15'
]
}
],
yAxis: [
{
type: 'value',
axisLabel: { show: false },
splitLine: { show: false }
}
],
series: [
{
name: '已安装',
type: 'bar',
label: {
show: true,
position: 'top',
color: '#fff'
},
itemStyle: {
normal: {
color: function (params) {
return new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{ offset: 0, color: '#1F7BE5' },
{ offset: 1, color: '#0CA7E3' }
]);
},
barBorderRadius: 5
}
},
data: [
200, 170, 240, 244, 200, 220, 210, 170, 240, 244, 200, 220, 210, 440, 10
]
},
{
name: '未安装',
type: 'bar',
label: {
show: true,
position: 'top',
color: '#fff'
},
itemStyle: {
normal: {
color: function (params) {
return new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{ offset: 0, color: '#FFD700' },
{ offset: 1, color: '#ffe766' }
]);
},
barBorderRadius: 5
}
},
data: [
320, 302, 341, 374, 390, 450, 420, 341, 374, 390, 450, 420, 430, 420, 1
]
},
{
type: 'pie',
radius: ['25%', '40%'],
center: ['50%', '27%'],
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
},
label: {
top: '5%',
textStyle: { color: '#fff' },
formatter: '{b}: {@2012} ({d}%)'
},
data: [
{ value: 1048, name: '已安装' },
{ value: 735, name: '未安装' }
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
};将上面的option放到任何一个echarts的在线示例中，然后运行，都将导致页面卡死。
Current Behavior
因为我的示例中既有饼图又有柱状图，而饼图都带有百分比的属性，所以我们希望当鼠标经过图形时可以显示百分比信息，而柱状图只有数字，没有百分比属性。如果它们使用同一个tooltip时就会导致查看柱状图的时候在值后面显示({d}%)，这显然是不科学的，所以我想给它们分别设置不同的tooltip，来分布显示不同的内容。
Expected Behavior
在我尝试给不同的图形设置不同的tooltip时，发现一旦我加了一个以上的tooltip时，页面都会卡死。
Environment
- OS:MacOS
- Browser:Chrome 96.0.4664.93
- Framework:NoneAny additional comments?
No response