Echarts放到bootstrap的tab-panel中不加载

2017-5-27 12:12

Web

152 字

1 分钟内

昨天晚上用echarts的时候发现的问题，今天又去折腾发现echarts初始化后canvas的宽度为0，明显是数据没写进去，就去找了下解决方案

原来是tab转换的时候div是没有height的，所有要在标签页显示后有了width和height之后再加载图表。
tab有show.bs.tab和shown.bs.tab两种，要选择shown显示后的

加上以下代码就行意思是切换tab时重新初始化图表

 
        $(function () {
            LoadChartBoard();
            $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
                // 获取已激活的标签页的名称
                var activeTab = $(e.target)[0].hash;
                if (activeTab == "#One") LoadChartBase();//加载图表
                if (activeTab == "#Two") LoadChartBoard();
                if (activeTab == "#Three") LoadChartSteel();
            });
        })

bootstrap echarts