小程序
小游戏
企业微信
微信支付
扫描小程序码分享
小程序在使用echarts后滑动到echarts部分后就无法滑动了,是什么引起的,有哪位大佬知道怎么解决吗?
3 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
ec-canvas里面有对touch事件的处理,如果你的图表不需要滑动,可以去ec-canvas.wxml中删掉touch相关的事件绑定
<canvas wx:if="{{isUseNewCanvas}}" type="2d" class="ec-canvas" canvas-id="{{ canvasId }}" bindinit="init" bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}" bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}" bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"></canvas>
或者在图表上加一个透明蒙层。
如果你的图表有设置了dataZoom需要滑动,需要在ec-canvas.js里面的touchStart和touchMove方法加一句 var touch = getTouch(e.touches) ,因为手指触摸时e.touches不止一个点,需要自定义getTouch方法获取准确的点
function getTouch(touches){ let touch ; for (let i = 0; i < touches.length; ++i) { touch = touches[i]; if(touch.x && touch.y){ touch.offsetX = touch.x; touch.offsetY = touch.y; break } } return touch; }
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
贴下代码
遇到跟你一样的问题,我也是将echarts嵌套在swiper里面的,但是我的echarts图表需要滑动。我整个页面超出的内容滑动到echarts部分后就无法再向下滑动了
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
ec-canvas里面有对touch事件的处理,如果你的图表不需要滑动,可以去ec-canvas.wxml中删掉touch相关的事件绑定
<canvas wx:if="{{isUseNewCanvas}}" type="2d" class="ec-canvas" canvas-id="{{ canvasId }}" bindinit="init" bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}" bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}" bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"></canvas>
或者在图表上加一个透明蒙层。
如果你的图表有设置了dataZoom需要滑动,需要在ec-canvas.js里面的touchStart和touchMove方法加一句 var touch = getTouch(e.touches) ,因为手指触摸时e.touches不止一个点,需要自定义getTouch方法获取准确的点
function getTouch(touches){ let touch ; for (let i = 0; i < touches.length; ++i) { touch = touches[i]; if(touch.x && touch.y){ touch.offsetX = touch.x; touch.offsetY = touch.y; break } } return touch; }
贴下代码
遇到跟你一样的问题,我也是将echarts嵌套在swiper里面的,但是我的echarts图表需要滑动。我整个页面超出的内容滑动到echarts部分后就无法再向下滑动了