apache / apache/echarts

[Bug] chart type=bar,mouse hover legend ,emphasis doesn't work when chart have at least 3000 data for one series

Open
#21,151 1 comment 0 reactions 0 assignees View on GitHub
bug topic: legend topic: state
Dominant language
TypeScript
Stars
67.3k
Forks
19.8k
Avg merge
11d 14h
Merged PRs (30d)
8

Description

### Version

5.6.0

### Link to Minimal Reproduction

https://echarts.apache.org/examples/zh/editor.html?code=PYBwLglsB2AEC8sDeAoW7aTAGwKYC5k0N0xcAPMQgckHJNQB1NA7Y0HnEwR_NA2p0D-1WACgFYADEMBUck0CdDgEpqAGmIk8AMyqxqAY1zQyAJ2pzYAX1kkwwYNkghCqEqS0QA5vdxaaAQ3IQAzjL3p3XgAVgCE1nK18MMABPEAIVTwALVwATYAB3XRsDPUM9PCdoZPCs5NcwV0IAbWomQHi9QHQlAEEZFTr6gCEWmsYGgGFqAF0cowxyRo9PYpto2JpVMtx7YC0onxKyithGrS1XKIA6BS1gAFseJFg8aHswBMJBIQNpXgB9Z4gJBAA-WAADIJCYAAJEgILAANSwACM-l-EhGJH8ngAKhBVABrKZZVzYBzQADqEFuABlXAAjXDYQhgLQAV1wEVy2ImpIpVKIWXQiXShAUOM8uFgAHohbBAAlpgHnQ8iAF3jAOAWgD9vQCncoAF40AG1mAcgNAL8BjOGeii4y8WMiMTi1AAbjj6ZkMEyMAK7LhJrBKhFrJzoK4Tqa2s0EdMTTQya4dH6SKVyoRtrsDkdTudLhobndYA8BE9eJ94D8ALJlBKHbCmLQ8XO3fa7Qpxz4AKmhQgEn0hUKE8Ii6CJuBOAGVongjVlVGZljQAMR8AAsAHYBKoAGzWrK2rKdkBJTyGjmc9AKYCqWlO6j2iCOtZb2Bk7C0rRdwezFSD5bJEILLtRTxkE4Lmz6RmhzdZD0vRoNpOj_UgAxUIMQzbWBw02KM9kOY4zguK4k3uet0x4TMczzAsixLPCK1SM4a1gAAOFsIVgAAmFswNgDtu17OI3S3QdCxcFQRwATihVRVEnPgvxIJcbBXNcNzYzkdz3A8jxPBj0AvK8b1AU0Hy0J8PTIV9307ESbV_V0YMA70enqfoGJmU0oNPdYIy2HZENjFCE2uW4MMeQwM2-WBS3zBRC2WQiy2IqtYFrWcqMhABmeiYKYnsoj7f9OQ44duL5VRyL4cjDPQMSSAk1x1ydaSslk_caAU7wlPPS9r1vDSi20l83w_ArskXPQhkKgBufqgA

### Steps to Reproduce

// 5000个数据点的柱状图
const bigDataBarChartOption = {
title: {
text: '大数据量柱状图 (5000个数据点)',
left: 'center'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
data: ['数据序列A', '数据序列B', '数据序列C']
},
xAxis: {
type: 'category',
data: Array.from({ length: 5000 }, (_, i) => `Point${i + 1}`),
axisTick: {
alignWithLabel: true
},
axisLabel: {
show: false // 隐藏x轴标签以提高性能
}
},
yAxis: {
type: 'value'
},
dataZoom: [
{
type: 'inside',
start: 0,
end: 10
},
{
start: 0,
end: 10
}
],
series: [
{
name: '数据序列A',
type: 'bar',
data: Array.from({ length: 5000 }, () => Math.floor(Math.random() * 1000) + 100),
itemStyle: {
color: '#5470c6'
},
emphasis: {
focus: 'series',
blurScope: 'coordinateSystem'
}
},
{
name: '数据序列B',
type: 'bar',
data: Array.from({ length: 5000 }, () => Math.floor(Math.random() * 800) + 200),
itemStyle: {
color: '#91cc75'
},
emphasis: {
focus: 'series',
blurScope: 'coordinateSystem'
}
},
{
name: '数据序列C',
type: 'bar',
data: Array.from({ length: 5000 }, () => Math.floor(Math.random() * 600) + 300),
itemStyle: {
color: '#fac858'
},
emphasis: {
focus: 'series',
blurScope: 'coordinateSystem'
}
}
]
};

### Current Behavior

chart type=bar,mouse hover legend ,emphasis doesn't work when chart have at least 3000 data for one series

### Expected Behavior

hope emphasis works no matter how many data the chart has

### Environment

```markdown
- OS:
- Browser:chrome
- Framework:react18
```

### Any additional comments?

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.