Копировать диаграммы Google в другой div не работает в IE

Question

Моя страница HTML с использованием вкладок css materialize.

Я построил все графические диаграммы google в «show» таблице divs, после этого я их спрячу, и когда пользователь нажимает на вкладку, я заменяю вкладку html на правильную из div 'hide'.

В Google Chrome и Firefox это работает хорошо, но в IE не работает :(

<div id="row1"> 
    <br /> 
    <table align="center" style="background-color:white"> 
     <tr valign="top"> 
      ... 
     </tr> 
     <tr valign="top"> 
      ... 
     </tr> 
    </table> 
    <br /> 
</div> 

<div id="row2"> 
    <br /> 
    <table align="center" style="background-color:white;"> 
     <tr valign="top"> 
      ... 
     </tr> 
     <tr valign="top"> 
      ... 
     </tr> 
    </table> 
    <br /> 
</div> 

<div class="col s12" id="dashboardtabs"> 
    <ul class="tabs" style="background-color:#80CBC4" id="tabs"> 
     <li class="tab col s3"><a id="titletab1" class="white-text" href="#tab1" onclick="reloadForTabs('titletab1')" style="background-color:#009688">Subjects Status</a></li> 
     <li class="tab col s3"><a id="titletab2" href="#tab2" class="white-text" onclick="reloadForTabs('titletab2')" style="background-color:#80CBC4">Stratification</a></li> 
    </ul> 
</div> 
<div id="tab1" class="col s12"></div> 

<div id="tab2" class="col s12"></div> 

Мой JS код:

при первом изменении нагрузки все строки DIV, чтобы показать - Google графике нужно построить на шоу дивы для настройки поддержки пользователей (ширина, высокая и т.д.):

var emptyTabs = function() 
    { 
     titletabs.forEach(function (val) { 
      $('#tab' + val.slice(-1)).html(''); 
     }); 
    } 

emptyTabs(); 
    //Changed chart divs from hide to show 
      titletabs.forEach(function (val) { 
       $('#row' + val.slice(-1))[0].style.display = 'block'; 
      }); 

После выбранной вкладки пользователя:

//Changed chart divs from show to hide 
titletabs.forEach(function (val) { 
    $('#row' + val.slice(-1))[0].style.display = 'none'; 
}); 
//Display the selected tab (After filters, in the first load and etc.) 
var selectedtab = document.getElementsByClassName('white-text active')[0].id; 
$('#tab' + selectedtab.slice(-1)).html($('#row' + selectedtab.slice(-1)).html()); 

В IE отображаются графики в «скрытых» div (не на вкладках), но когда html div вставляется в вкладку - данные пустые, график отображает со всеми его свойствами, но без данных (bar диаграмма - без баров).

так:

И не нравится:

Open https://jsfiddle.net/wjqwd467/ в Google Chrome и IE и увидеть разные ...

Могли кто-нибудь Помогите мне?

Спасибо!

Answer 1

для начала, Object.values не совместим с IE

см ->Object.values() - browser compatibility

попробуйте заменить ...

 for (var i = 0; i < arraydata.length; i++) { 
      var daraarr = []; 
      for (var key in arraydata[i]) { 
       if (arraydata[i].hasOwnProperty(key)) { 
       daraarr.push(arraydata[i][key]); 
       } 
      } 
      daraarr.push("color:" + mycolor[arraydata[i].rownum]); 
      datatable.addRow(daraarr); 
     }