扫描小程序码分享
关于echarts图表有三个问题
1.在开发者工具中,图表组件固定在页面上,无法随页面滑动,ios真机上可以正常滑动,层级正常
2.使用force-use-old-canvas="true"属性,开发者工具上可以正常滑动,真机上层级最高,弹窗组件遮挡不住,已经确认canvas使用的是新版本,有type=“2d”属性,设置z-index值仍然不生效。
3.使用echarts的dataZoom属性不生效,无法做到柱状图表纵向手动缩放的效果。求各位大佬解答。
1 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
开发者工具中的原生组件(如 Canvas)层级固定,不支持滚动穿透,而真机环境表现正常。
解决方案:
1.外层容器优化
确保图表包裹在可滚动容器(如 scroll-view)内,并设置容器高度:
scroll-view
<scroll-view scroll-y style="height: 100vh;"> <view style="height: 500rpx;"> <ec-canvas canvas-id="chart" ec="{{ ec }}"></ec-canvas> </view> <!-- 其他内容 --> </scroll-view>
2.开启原生滚动
在 app.json 中全局启用原生滚动:
app.json
{ "window": { "enableNative": true } }
希望能帮上你的忙!
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
开发者工具中的原生组件(如 Canvas)层级固定,不支持滚动穿透,而真机环境表现正常。
解决方案:
1.外层容器优化
确保图表包裹在可滚动容器(如
scroll-view
)内,并设置容器高度:<scroll-view scroll-y style="height: 100vh;"> <view style="height: 500rpx;"> <ec-canvas canvas-id="chart" ec="{{ ec }}"></ec-canvas> </view> <!-- 其他内容 --> </scroll-view>
2.开启原生滚动
在
app.json
中全局启用原生滚动:{ "window": { "enableNative": true } }
希望能帮上你的忙!