Javascript 谷歌chars没有'；t与iframe一起出现

我正在使用MVC4创建web应用程序。
在我的网页中，我想放置一个谷歌图表（折线图）和一个iframe到某个外部站点。
我从官方文档中获取了javascript代码（）

因此，我的代码如下所示：

@{
    ViewBag.Title = "Page";
}
@section Scripts
{
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load('visualization', '1.1', { packages: ['line'] });
    google.setOnLoadCallback(drawChart);

    function drawChart() {

        var data = new google.visualization.DataTable();
        data.addColumn('number', 'Day');
        data.addColumn('number', 'Guardians of the Galaxy');
        data.addColumn('number', 'The Avengers');
        data.addColumn('number', 'Transformers: Age of Extinction');

        data.addRows([
          [1, 37.8, 80.8, 41.8],
          [2, 30.9, 69.5, 32.4],
          [3, 25.4, 57, 25.7],
          [4, 11.7, 18.8, 10.5],
          [5, 11.9, 17.6, 10.4],
          [6, 8.8, 13.6, 7.7],
          [7, 7.6, 12.3, 9.6],
          [8, 12.3, 29.2, 10.6],
          [9, 16.9, 42.9, 14.8],
          [10, 12.8, 30.9, 11.6],
          [11, 5.3, 7.9, 4.7],
          [12, 6.6, 8.4, 5.2],
          [13, 4.8, 6.3, 3.6],
          [14, 4.2, 6.2, 3.4]
        ]);

        var options = {
            chart: {
                title: 'Box Office Earnings in First Two Weeks of Opening',
                subtitle: 'in millions of dollars (USD)'
            },
            width: 900,
            height: 500
        };
        var chart = new google.charts.Line(document.getElementById('linechart_material'));

        chart.draw(data, options);
    }
</script>
}
    <h2>Page</h2>
    <table>
        <tr>
            <td style="width: 50%">
                <div id="linechart_material"></div>
            </td>
        </tr>
        <tr>
            <td style="width: 50%">
                <iframe id="videoiframe" src="https://www.google.com/starwars/" />
            </td>
        </tr>
    </table>

@{
ViewBag.Title=“页面”；
}
@节脚本
{
load（'visualization'，'1.1'，{packages:['line']}）；
setOnLoadCallback（drawChart）；
函数绘图图（）{
var data=new google.visualization.DataTable（）；
data.addColumn（'number'，'Day'）；
data.addColumn（'数字'，'银河守护者'）；
data.addColumn（'数字'，'复仇者'）；
data.addColumn（'数量'，'变压器：熄灭年龄'）；
data.addRows([
[1, 37.8, 80.8, 41.8],
[2, 30.9, 69.5, 32.4],
[3, 25.4, 57, 25.7],
[4, 11.7, 18.8, 10.5],
[5, 11.9, 17.6, 10.4],
[6, 8.8, 13.6, 7.7],
[7, 7.6, 12.3, 9.6],
[8, 12.3, 29.2, 10.6],
[9, 16.9, 42.9, 14.8],
[10, 12.8, 30.9, 11.6],
[11, 5.3, 7.9, 4.7],
[12, 6.6, 8.4, 5.2],
[13, 4.8, 6.3, 3.6],
[14, 4.2, 6.2, 3.4]
]);
变量选项={
图表：{
片名：“首映前两周的票房收入”，
字幕：“百万美元”
},
宽度：900，
身高：500
};
var chart=new google.charts.Line（document.getElementById（'linechart_material'）；
图表绘制（数据、选项）；
}
}
页

这就是它变得奇怪的地方。
当我运行应用程序时，图表没有呈现。但是，一旦我删除了iframe，它就可以正常工作。

---

有没有人遇到过这样的问题

显然，此行为与自动关闭标记相关：

，在这种情况下，

iframe

元素被视为缺少关闭标记

根据：

给定内容模型不为空的元素的空实例 （例如，空标题或段落）不要使用 表单（例如，使用

而不是

）
总之，在指定的示例中，JS图表插入到非关闭的
iframe
元素之后的页面上。解决办法是取代：

<iframe id="videoiframe" src="https://www.google.com/starwars/" />



与



<iframe id="videoiframe" src="https://www.google.com/starwars/"></iframe>