search

ant-design / ant-design-charts

A React Chart Library
https://ant-design-charts.antgroup.com/
MIT License
1.89k stars 359 forks source link

🐛[BUG]Antd charts blocks page scroll on mobile web (android) #2532

Open RubelBiswasCS opened 3 months ago

RubelBiswasCS commented 3 months ago

In my website I have a page containing 6-7 ant design plot charts, there is also other content on that page. Now the problem with antd chart is when tried to scroll with touch in mobile phone (Android). touch on the chart blocks the page scroll, like page does not scroll when thumb on any of these charts. only showing tooltip of the chart. How can i solve this issue. @ant-design/plots": "^2.1.13" that the version used. also tried different version by upgrade or downgrading the version but the result is the same.

for example, this is the page -> https://mobiledev.biniyog.com.bd/company/1STPRIMFMF, can login in with google if anyone want to view this issue.

RubelBiswasCS commented 3 months ago

It seems by default touch-action: none applied to the chart's canvas element. Finally solved this issue by applying this css rule, touch action: pan-y to the canvas element.

canvas {
  touch-action: pan-y !important;
}