在使用echarts的时候页面中有tab栏的时候经常遇到echarts错位的情况

解决方法一、在点击tab栏的时候进行页面中的echarts初始化

在多层tab栏存在的时候eachrts的容器布局是百分比的时候进行初始化也会出现错位

因为echarts识别的是px,而百分比的也会转化成px的形式,所以就会出现错位

解决方法二、在初始化之前先获取宽高并进行设置

var width = $('#'+idName).width()
var height = $('#'+idName).height()
$('#'+idName).css("width",width).css("height",height)

初始化之前加入上边的代码后进行切换的时候就不会出现错位的情况

这种解决方法存在的问题就是不能给echarts的容器设置padding值,如果设置了后再通过上边的方法的话就会出现没切换一次tab栏就echarts的容器就减少padding的值,如果设置了padding的话就不能使用width和height来获取和设置了,而是使用innerWidth和innerHeight

05-19 09:04