将谷歌图表复制到另一个div在IE中不起作用

时间:2017-02-16 12:24:37

标签: javascript html charts google-chartwrapper

我的HTML页面使用css实现标签。

我在'show'表格div中构建我所有的谷歌图表图表,之后我“隐藏”它们,当用户点击标签时,我用“隐藏”div替换html标签中正确的一个。

在谷歌浏览器和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更改为显示 - 谷歌图表需要在show divs上构建支持用户设置(宽度,高等):

    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插入标签时 - 数据为空,图表显示其所有属性但没有数据(条形图 - 没有酒吧)。

像这样:

enter image description here

而不是这样:

enter image description here

在Google Chrome和IE浏览器中打开https://jsfiddle.net/wjqwd467/并查看其他内容......

有人可以帮助我吗?

谢谢!

0 个答案:

没有答案