时间:2021-07-01 10:21:17 帮助过:42人阅读
前端时间做一个vue的项目,echart是按需引入的如下:
然后发现在缩放浏览器窗口时折线图并不会自适应,费了好一会才解决,记录下来给需要的小伙伴,
第一种:浏览器自适应
通过:
在myChart.setOption后添加
如果有多个图形,可以封装成方法:
第二种情况,根据p大小的变化进行自适应
因为vue不能实时监测p大小变化的,所以我定义了一个按键,当按键的值变化的时候,进行resize;
其实我用这个是在导航进行伸缩的时候,导致p大小发生了变化,所以这样执行reszie,就能完美的自适应
上面是我整理给大家的,希望今后会对大家有帮助。
相关文章:
在vue中slot如何实现在子组件中显示父组件传递的模板(详细教程)
利用vue如何实现裁切图片同时实现放大、缩小、旋转功能(详细教程)
有关React组件性能优化详细讲解
以上就是在vue中使用echarts3.0自适应的方法有哪些?的详细内容,更多请关注Gxl网其它相关文章!