1、參考連線：https://blog.csdn.net/qq_24313955/article/details/78363981

問題描述：在echarts跟bootstrap選項卡整合的時候，預設第一個選中選項卡可以正常載入echarts圖表，但是切換其他選項的時候不能渲染出其他選項卡echarts圖表。（這裡暫時未考慮自適應問題）。

由於使用的格式和參考不一樣，所以自己貼一下，方便自己以後使用。

2、在js檔案頁面最上面定義一個js陣列。如var charts = new Array();
因為我的主頁是根據$(function(){  ..... })。
然後在裡面.....位置寫了如下所示的，使用呼叫方法進行處理的。

chart5 = ec.init(document.getElementById('chart5'));
barChart2(data2, chart5, "xxxx");

具體這裡不再展示。

3、然後呢，在你呼叫的方法，最下面加上charts.push(chart);即可。

chart.setOption(memoryOption, true);
charts.push(chart);

4、然後呢，js檔案最後面加上如下所示程式碼即可。

 1 //解決切換tab,非預設的柱狀圖表格不顯示問題
 2 $(function(){
 3     //console.log(charts);
 
//列印顯示是否新增進去
 4     $(window).resize(function() {
 5         for(var i = 0; i < charts.length; i++) {
 6             charts[i].resize();
 7         }
 8     });
 9     
10     //data-toggle="pill還是data-toggle="tab" 根據前面所用標籤頁的不同來選擇。我使用的是data-toggle="tab"。
11     //解決tab切換不顯示問題 在載入視窗後重新渲染。
12     $('
 
a[data-toggle="tab"]').on('shown.bs.tab', function(e) {
13         for(var i = 0; i < charts.length; i++) {
14             charts[i].resize();
15         }
16     });
17     
18 })

然後呢，你點選你的tab切換，就可以看到報表可以正常顯示了的。

待續.....