apache / apache/echarts

[Feature] data sampling in dataZoomSlider

Open
#18,754 2 comments 0 reactions 0 assignees View on GitHub
difficulty: easy en new-feature
Dominant language
TypeScript
Stars
67.3k
Forks
19.8k
Avg merge
11d 14h
Merged PRs (30d)
8

Description

### What problem does this feature solve?

Consider the following example (or via [echarts examples](https://echarts.apache.org/examples/zh/editor.html?c=area-time-axis&code=DYUwLgBAJghmMQLwQNoF0DcAoAZgewCcIAKUSASyQgEYMJKAeCAJgAZ3W7yBqbgSggBvLBGhwYAOgAOAVwDOAC2IpyAGggBZOAolzyAO2LFKAeggBWAQCpN2iQAUAknzR9sAXyx4pYcnn1UwqIAHgCCweRyAFxC7qoiEACe4ZExgnEJsPAAWnh4ALYxKAmiQaLlcvAEYDGs8eXlIPpQMeYlEJ6iaPUQciAE5CDRqO1lDWCJUiAxAOTABiAzPQ1yifkARnjAs_r-i8vlWTAxR-2dEGhY7hhAA)):

```javascript
let data = [];
for (let i = 1; i < 20000; i++) {
data.push([i, Math.sin((i / 5) * Math.PI)]);
}
option = {
xAxis: {},
yAxis: {},
dataZoom: [
{
start: 0,
end: 5
}
],
series: [
{
type: 'line',
symbol: 'none',
data: data
}
]
};

```

![图片](https://github.com/apache/echarts/assets/1650579/edf3e9bf-0998-4fef-a712-19e022037bc4)

As the above image shows, the shadow polyline in dataZoom slider does not reflect the correct "shape" (or "outline") of the actual data.

Update: this problem only occurs at specific dimensions, e.g. when `#chart-container` is `width: 1480px`.

The data in shadow is resampled [here](https://github.com/apache/echarts/blob/e20d372b01c69c2d1897737b275aaa3abe234398/src/component/dataZoom/SliderZoomView.ts#L396) as `this._shadowPolygonPts` and `this._shadowPolylinePts`.

This can be improved by applying `sampling` like `lttb`.

### What does the proposed API look like?

in option:

```javascript
{
dataZoom: {
dataSampling: '', // default none, can be lttb, average, max, min, sum
}
}
```

or just

```javascript
{
dataZoom: {
sampling: '', // default none, can be lttb, average, max, min, sum
}
}
```

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.