上图:
结构采用栅格布局的方式,左边图表设置了宽度自适应 autoFit:true。页面首次进入的时候canvas的宽度超出的了父元素的宽度。如果改变 浏览器的大小,触发了window.resize的时候才会触发autoFit:true 这个属性,才会自适应屏幕的宽度,图表大小才会正常。
vue版本解决方法:在mounted周期函数中,初始化图表之前加入下面代码,将初始化图表的方法放在setTimeout里面
mounted() {
const init = document.createEvent('Event')
init.initEvent('resize', true, true)
window.dispatchEvent(init)
setTimeout(()=>{
this.chart();
},10)
},
这是图表是正常的。
常见问题FAQ
- 免费下载或者VIP会员专享资源能否直接商用?
- 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
- 提示下载完但解压或打开不了?
- 找不到素材资源介绍文章里的示例图片?
- 模板不会安装或需要功能定制以及二次开发?
发表评论
还没有评论,快来抢沙发吧!