[Bug] After setting all the 'symbol' in the line chart, if the amount of line data is large, the graph will freeze.
- Dominant language
- TypeScript
- Stars
- 67.3k
- Forks
- 19.8k
- Avg merge
- 11d 14h
- Merged PRs (30d)
- 8
Description
### Version
5.4.3
### Link to Minimal Reproduction
let base = +new Date(1968, 9, 3); let oneDay = 24 * 3600 * 1000; let date = []; let data = [Math.random() * 300]; for (let i = 1; i < 20000; i++) { var now = new Date((base += oneDay)); date.push([now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/')); data.push(Math.round((Math.random() - 0.5) * 20 + data[i - 1])); } option = { tooltip: { trigger: 'axis', position: function (pt) { return [pt[0], '10%']; } }, title: { left: 'center', text: 'Large Area Chart' }, xAxis: { type: 'category', boundaryGap: false, data: date }, yAxis: { type: 'value', boundaryGap: [0, '100%'] }, series: [ { name: 'Fake Data', type: 'line', symbol: 'emptyCircle', symbolSize:9, showAllSymbol:true, showSymbol:true, itemStyle: { color: 'rgb(255, 70, 131)' }, data: data } ] };
### Steps to Reproduce
let base = +new Date(1968, 9, 3);
let oneDay = 24 * 3600 * 1000;
let date = [];
let data = [Math.random() * 300];
for (let i = 1; i < 20000; i++) {
var now = new Date((base += oneDay));
date.push([now.getFullYear(), now.getMonth() + 1, now.getDate()].join('/'));
data.push(Math.round((Math.random() - 0.5) * 20 + data[i - 1]));
}
option = {
tooltip: {
trigger: 'axis',
position: function (pt) {
return [pt[0], '10%'];
}
},
title: {
left: 'center',
text: 'Large Area Chart'
},
xAxis: {
type: 'category',
boundaryGap: false,
data: date
},
yAxis: {
type: 'value',
boundaryGap: [0, '100%']
},
series: [
{
name: 'Fake Data',
type: 'line',
symbol: 'emptyCircle',
symbolSize:9,
showAllSymbol:true,
showSymbol:true,
itemStyle: {
color: 'rgb(255, 70, 131)'
},
data: data
}
]
};
### Current Behavior
After using the above configuration, the page will become very laggy. I know that there will be some optimization after setting 'lttb', but in our usage scenario, we need to display the full amount of data, and the 'lttb' setting sometimes skips the extreme Value point, so we can't use it, but even if 'lttb' is turned on, when there are multiple line graphs, there will be lag even if the 'symbol' on each line is rare.
### Expected Behavior
In the big data scenario, this lag problem can be optimized. In our scenario, up to 12 lines will be set, each line has 11,000 pieces of data.
### Environment
```markdown
- OS:
- Browser:
- Framework:
```
### Any additional comments?
_No response_
Contributor guide
Assessment
This issue has not been assessed yet.