[Bug] [Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' event. Consider marking event handler as 'passive' to make the page more responsive.

[Skrypt]

trafficstars

Version

5.4.1

Link to Minimal Reproduction

No response

Steps to Reproduce

import * as echarts from "echarts";

echarts.init(container);

Current Behavior

[Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' event. Consider marking event handler as 'passive' to make the page more responsive. See https://www.chromestatus.com/feature/5745543795965952

Expected Behavior

This violation warning should not display.

Environment

- OS: Windows 11
- Browser: 110.0.5481.77
- Framework: Vue 3

Any additional comments?

No response

[doyao]

I found the method of installing default-passive-events on the internet and the warning disappeared. But when I use the scrolling chart of echarts, I will report an error: Unable to preventDefault inside passive event listener invocation

[LvChengbin]

Will this bug be fixed soon?

[clark-tan]

Hope to fix it in the next release

[ericrange]

+1

[Thevyn]

+1

[kanxingyv]

We need to fix this problem, please.

[plainheart]

Some components like DataZoom will need to stop the scroll behavior, so it can't be simply set as passive.

[cj123195]

+1， v5.4.2

[chainix]

+1, v5.4.3

[rr13k]

+1 需要修复这个问题

[yimingbot]

+1 [email protected] [email protected] 调用echarts.init初始化时 就会出现这个告警

[zyt520ham]

请在 init 方法调用mousewheel监听的事件中添加 { passive: true } 选项参数，屏蔽一下这个警告，谢谢

[History-1024]

添加了 { passive: true } 选项参数 ，没生效 还是报这个警告，你们的解决了吗

[AKclown]

添加了 { passive: true } 选项参数 ，没生效 还是报这个警告，你们的解决了吗

官方都没有这个 参数，肯定没生效呢。 目前看没有解决，我也遇到同样的警告在init时

[Dev-Hogan]

I have the same issue

[shifatul-i]

+1

[NazarovAsadbek-AX]

+1

[xiaoyan13]

建议新版本在相关的处理事件的监听中，显式的声明出 passive 的状态，以屏蔽此警告

[YI--]

Any new developments?

[zhisonggang]

v5.5.0 also get warnning

[CollectorOfGarbage]

Is there any progress on this?

[hukun1993]

+1 需要修复这个问题

[jy03187487]

I also got this waning. Is there a plan to fix this?

[funnel20]

Also applicable on macOS 14.6.1 with Chrome 127.0.6533.120 and ECharts 5.5.1

[BradleyyKim]

My package version is like below. and it is still make warning in console. "echarts": "^5.5.1", "echarts-for-react": "^3.0.2",

is there any way to optimize performance in echarts-for-react like "add passive property in echarts-for-react" ?

[francoisburdy]

+1

[gemma1987]

+1 Same behaviour in "echarts": "^5.5.1", for angular, with dataZoom, so it cannot be turned to passive. Would like to have a solution for this

[gemma1987]

Some components like DataZoom will need to stop the scroll behavior, so it can't be simply set as passive.

Since the bug has been taken off it has been a long time, is there going to be a solution any time soon? As you said, you cannot just set it to passive, since DataZoom is there...

[Johnwjl]

+1 , "echarts": "^5.5.1"

[madpixelchile]

Hello everyone, I added this package to my react project with echarts, did the import and it solved the warnings problem apparently.

Step 1: npm install default-passive-events --save-dev

Step 2: import 'default-passive-events'

https://www.prestashop.com/forums/topic/901204-solved-uses-passive-event-listeners-to-improve-scrolling-performance-ps1742/

Package: https://www.npmjs.com/package/default-passive-events