在uni-app中使用render.js渲染了echarts,在PC端点击事件是正常的,在移动端点击事件失效了。

ekqde3dh  于 3个月前  发布在  uni-app
关注(0)|答案(5)|浏览(51)

问题描述
在uni-app中使用render.js渲染了echarts,在PC端点击事件是正常的,在移动端点击事件失效了。导致了移动端图表交互出现了问题。

复现步骤
我提供的复现代码链接: https://github.com/MambaNeverOut/echarts-bug-demo
[复现问题的步骤]

  1. 下载 HBuilderX ,下载链接: https://www.dcloud.io/hbuilderx.html
  2. 下载我的 demo, 在HBuilderX打开并运行。我的demo代码: https://github.com/MambaNeverOut/echarts-bug-demo
  3. 在浏览器打开,切换到手机模拟器状态,点击图表

预期结果
使用echarts 散点图,在PC端,鼠标移入后的效果是这样,在移动端鼠标点击也可以实现同样的效果

实际结果
但是我在使用中,移动端没有实现这个效果,所以我看了代码以后觉得是点击事件导致的。

系统信息:

  • 发行平台: H5平台
  • 操作系统:Windows 10 64位系统
  • HBuilderX 3.4.7

补充信息
移动端初始化图表后,为图表绑定了点击事件。但是在点击图表的时候并没有触发这个点击事件。

cetgtptt

cetgtptt1#

理论上不是uni-app框架导致,应该是echarts对touch事件对兼容问题。

需要从源头处理,或者业务层规避。

prdp8dxp

prdp8dxp2#

理论上不是uni-app框架导致,应该是echarts对touch事件对兼容问题。

需要从源头处理,或者业务层规避。

如果不使用 uni-app 的 renderjs 的渲染方式,echarts 在移动端的功能是正常的。

rvpgvaaj

rvpgvaaj3#

理论上不是uni-app框架导致,应该是echarts对touch事件对兼容问题。
需要从源头处理,或者业务层规避。

如果不使用 uni-app 的 renderjs 的渲染方式,echarts 在移动端的功能是正常的。

在uni-app的web-view组件中表现是否正常?

z3yyvxxp

z3yyvxxp4#

理论上不是uni-app框架导致,应该是echarts对touch事件对兼容问题。
需要从源头处理,或者业务层规避。

如果不使用 uni-app 的 renderjs 的渲染方式,echarts 在移动端的功能是正常的。

在uni-app的web-view组件中表现是否正常?

如果我使用 js 方式去渲染 echarts ,然后在uni-app的web-view 组件中展示,这样效果是正常的

lzfw57am

lzfw57am5#

理论上不是uni-app框架导致,应该是echarts对touch事件对兼容问题。
需要从源头处理,或者业务层规避。

如果不使用 uni-app 的 renderjs 的渲染方式,echarts 在移动端的功能是正常的。

在uni-app的web-view组件中表现是否正常?

如果我使用 js 方式去渲染 echarts ,然后在uni-app的web-view 组件中展示,这样效果是正常的

好的,分析是由于 echarts 从一些环境信息判断为了 PC 端。不过此类问题的排查,可能排不到前面。

在此之前你可以尝试使用 chrome://inspect/#devices 进行调试,初步定位一些信息。

相关问题