apache / apache/echarts

[Bug] 高频率更新echarts中的数据时,无法使用brush来框选

Open
#20,377 2 comments 0 reactions 0 assignees View on GitHub
bug en pending
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

https://echarts.apache.org/examples/zh/editor.html?c=area-time-axis

### Steps to Reproduce
将以下js代码直接复制到上面那个示例的js文件中,然后进行datazoom刷选动作即可复现
var dom = document.getElementById('chart-container');
var myChart = echarts.init(dom, null, {
renderer: 'canvas',
useDirtyRect: false
});
var app = {};

var option;

let base = +new Date(1988, 9, 3);
let oneDay = 24 * 3600 * 1000;
let data = [[base, Math.random() * 300]];
for (let i = 1; i < 20000; i++) {
let now = new Date((base += oneDay));
data.push([+now, Math.round((Math.random() - 0.5) * 20 + data[i - 1][1])]);
}
setInterval(() => {
data[data.length - 1][1] = Math.round((Math.random() - 0.5) * 20 + data[19999][1]);
option = {
tooltip: {
trigger: 'axis',
position: function (pt) {
return [pt[0], '10%'];
}
},
title: {
left: 'center',
text: 'Large Ara Chart'
},
toolbox: {
feature: {
dataZoom: {
yAxisIndex: 'none'
},
restore: {},
saveAsImage: {}
}
},
xAxis: {
type: 'time',
boundaryGap: false
},
yAxis: {
type: 'value',
boundaryGap: [0, '100%']
},
dataZoom: [
{
type: 'inside',
},
{
start: 0,
end: 20
}
],
series: [
{
name: 'Fake Data',
type: 'line',
smooth: true,
symbol: 'none',
areaStyle: {},
data: data
}
]
};

if (option && typeof option === 'object') {
myChart.setOption(option);
}
}, 200)

window.addEventListener('resize', myChart.resize);

### Current Behavior

数据快速刷新, 无法进行刷选放大

### Expected Behavior

数据快速刷新, 能够正常刷选放大

### Environment

```markdown
- OS:
- Browser:
- Framework:
```

### Any additional comments?

跟之前这个是同一个问题,请帮忙看看
[https://github.com/apache/echarts/issues/10859](url)

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.