echarts [Bug] In Line series chart, the series is not removed when using the legend for filter After applying the datazoom

nom7f22z  于 3个月前  发布在  Echarts
关注(0)|答案(7)|浏览(66)

Version

5.4.2

https://codepen.io/Suraj-Singhvi/pen/BaqgKRw

Steps to Reproduce

  1. Load the given chart options
  2. Use the data zoom slider to zoom into specific date/month
  3. Drag the slider from one direction to the other side.
    ex. start.....end should now be end....start
  4. filter both the series using the legends (you would see the last series filtered would still exist)
  5. and now on enabling them again, we now have an unwanted series line in our charts

Current Behavior

Initial state on using the datazoom slider

Now use the end of the slider and move it across the start of the slider

On filtering the series with the legend, the last series filtered is still visible

And now on toggling it back, the unknown series line exists in the chart

(Also, sometimes the line series keeps drawing lines on zooming via the slider but I don't have the exact steps as this is a bit random.)

Expected Behavior

I would expect the legend to filter out all the series, does not matter how the data zoom slider is used

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

9wbgstp7

9wbgstp71#

could not reproduce in given codepen.io link

qnakjoqk

qnakjoqk2#

I can reproduce it. Important is using the dataslider as described in the "steps to reproduce". Even if all series are hidden from the legend, there remain some lines on the screen.

zhte4eai

zhte4eai3#

any progress on this bug?

vfhzx4xs

vfhzx4xs4#

with 10,000+ data points, 5 zooms and additional controls like moveOnMouseMove, moveOnMouseWheel, zoomOnMouseWheel - no wonder there are problems. This is not a Minimal Reproduction and chances of some volunteer debugging it are very slim.

jaql4c8m

jaql4c8m5#

I have created a minimal reproduction sample here https://codepen.io/Suraj-Singhvi/pen/eYXJwXM

the weird part is it works fine when the datapoints for each series is around 1450 but fails for 1500+ points.

Try to tweak the numbers in the example shared

rqdpfwrv

rqdpfwrv6#

Thanks for this minimal reproduction. Indeed weird behavior and definitely a bug imho.

I played around with the minimal a little bit and realized that the bug does not occure if the dataZoom.filterMode is not set to none . However, this should be a valid setting to avoid "empty" charts when zooming in and having the points of the zoom range.

q35jwt9p

q35jwt9p7#

I tried again by removing the dataZoom.filterMode but the problem still persist if the number of datapoints are more.

One possible solution would be to have option in the legend to have at least legend avaiable for selection as selecting all the legend would result in showing no series which i dont think is desirable.
Having option like selectedMode: custom and user can define how much selection they want to provide

I solved it with below solution

onLegendSelectChanged(event: any): void {
   const selectedLegendCount = Object.values(event.selected).filter(
     (value) => value,
   ).length;

   // Prevent further legend selection
   if (selectedLegendCount === 0) {  
    // get the eChartInstance
       eChartInstance.dispatchAction({
         type: 'legendSelect', // keep the legend selection
         name: event.name,
       });
   }
 }

相关问题