【小5聊】echarts基础之从曲线图切换到饼状图显示时高宽度为0导致无法显示解决方法

1、通过display:none和block之间切换显示曲线图和饼状图出现高度为0的情况，如下

2、原因

1）A对象默认是display:block，B对象是display:none

由于A和B都进行了初始化

echarts.init(document.getElementById("A"));

echarts.init(document.getElementById("A"));

就会自动加上属性，_echarts_instance_="ec_1575962075935"

所以点击切换显示到B的时候，其实就是高宽度为0的情况，自然就显示不出来了

3、解决方法

在切换的时候，进行属性清除以及设置好高宽度，重现渲染

$("#B").removeAttr("style").removeAttr("_echarts_instance_"); //去掉属性，重新渲染
$("#B").css({ "margin-top": "50px","float": "left","width": $("#B canvas").width() / 2 - 0 + "px", "height": $("#B canvas").height() / 2 - 0 + "px" });

var bChart = echarts.init(document.getElementById("B"));

if (option && typeof option === "object") {
   bChart .setOption(option, true);
}