随身笔记
随身笔记

echarts自适应屏幕

let map = echarts.init( this.$refs.chinaMap ),
     
map.setOption( options );

window.addEventListener('resize', function() {
  map.resize()
})

 

如果你用的是v-chart方式引入,需要到autoresize属性,那么v-chart需要包裹一层div,且有flex属性,如:
<div style="display: flex;overflow:hidden;">
    <v-chart ref="mychart" v-on="$listeners" className="chart-new" :autoresize="true" :options="options"/>
</div>


mounted() {
   window.addEventListener("resize", this.resizeTheChart);
},
methods: {
  resizeTheChart() {
     if (this.$refs.mychart) {
       this.$refs.mychart.resize();
     }
  }
}

https://www.jianshu.com/p/a62845830ccc

 

随身笔记

echarts自适应屏幕
let map = echarts.init( this.$refs.chinaMap ), map.setOption( options ); window.addEventListener('resize', function() { map.resize() })   如果你用的是v-…
扫描二维码继续阅读
2022-08-17