[Bug] Graph Line Distortion When Zooming: Unexpected Connections Between Remaining Points
Version
5.5.1
Link to Minimal Reproduction
Steps to Reproduce
option = { xAxis: { type: 'category', boundaryGap: false }, yAxis: { type: 'value', boundaryGap: [0, '30%'] }, dataZoom: [ { type: 'inside' }, { type: 'slider', showDataShadow: false, handleIcon: 'path://M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z', handleSize: '80%' }, { type: 'inside', orient: 'vertical' }, { type: 'slider', orient: 'vertical', showDataShadow: false, handleIcon: 'path://M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z', handleSize: '80%' } ], visualMap: { type: 'piecewise', show: false, dimension: 0, seriesIndex: 0, pieces: [ { gt: 1, lt: 3, color: 'rgba(0, 0, 180, 0.4)' }, { gt: 5, lt: 7, color: 'rgba(0, 0, 180, 0.4)' } ] }, series: [ { type: 'line', smooth: 0.6, symbol: 'none', lineStyle: { color: '#5470C6', width: 5 }, markLine: { symbol: ['none', 'none'], label: { show: false }, data: [{ xAxis: 1 }, { xAxis: 3 }, { xAxis: 5 }, { xAxis: 7 }] }, areaStyle: {}, data: [ ['2019-10-10', 200], ['2019-10-11', 560], ['2019-10-12', 750], ['2019-10-13', 580], ['2019-10-14', 250], ['2019-10-15', 300], ['2019-10-16', 450], ['2019-10-17', 300], ['2019-10-18', 100] ] } ] };
Current Behavior
This is what the chat looks like after initialization:
When zooming into the chart, the curve of the chart changes in a way that it no longer displays the desired shape or behavior:
Expected Behavior
The actual curve of the graph should remain approximately the same:
When zooming into the chart and some points end up outside the visible area, the remaining points are automatically reconnected, creating new connections. This, however, alters the curve of the graph. My expectation is that the graph's line should exit the chart at the x-axis (zero line) and re-enter later without changing the original curve.
Environment
- OS:
- Browser:
- Framework:
Any additional comments?
No response
I'm sorry to close this issue for it lacks the necessary title. Please provide a descriptive and as concise as possible title to describe your problems or requests and then the maintainers or I will reopen this issue.
Every good bug report or feature request starts with a title. Your issue title is a critical element as it's the first thing maintainers see.
A good issue title makes it easier for maintainers to understand what the issue is, easily locate it, and know what steps they'll need to take to fix it.
Moreover, it's better to include keywords, as this makes it easier to find the issue self and similar issues in searches.
confirmed - Demo