谷歌图表：折线图：在 IE 和 Firefox 中不显示，但在 chrome 中有效答案

【问题标题】：Google Charts: Line Chart: Doesn't display in IE and Firefox, but works in chrome谷歌图表：折线图：在 IE 和 Firefox 中不显示，但在 chrome 中有效
【发布时间】：2015-06-18 06:54:09
【问题描述】：

我有一个简单的图表（尽管有很多数据），它在 chrome 中呈现良好，但在 IE 或 Firefox 中不呈现。由于我对 Web 开发知之甚少，我不知道如何找出问题所在。

谁能帮我找出问题所在，或者解释一下他们是如何解决的？

<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load("visualization", "1", {packages:["corechart"]});
    google.setOnLoadCallback(drawChart);
    function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('datetime', 'Time');
        data.addColumn('number', 'Amelias Room');
        data.addColumn('number', 'board1');
        data.addColumn('number', 'board2');
        data.addColumn('number', 'Emersons Room');
        data.addRows([
            [new Date('2012-03-27 08:25:00'), 73,67,67,71],
            [new Date('2012-03-27 08:26:00'), 73,67,67,71],
            [new Date('2012-03-27 08:27:00'), 73,67,67,71],
            [new Date('2012-03-27 08:28:00'), 74,67,67,71],
            [new Date('2012-03-27 08:29:00'), 74,67,67,71],
            [new Date('2012-03-27 08:30:00'), 75,67,67,71],
            [new Date('2012-03-27 08:31:00'), 75,67,67,71],
            [new Date('2012-03-27 08:32:00'), 74,67,67,71],
            [new Date('2012-03-27 08:33:00'), 74,67,67,71],
            [new Date('2012-03-27 08:34:00'), 73,67,67,71],
            [new Date('2012-03-29 08:19:00'), 70.2244318181818,68.39375,67.8772727272728,71.0528409090909],
            [new Date('2012-03-29 08:20:00'), 70.1732954545455,68.45,67.8777173913044,71.0323863636363],
            [new Date('2012-03-29 08:21:00'), 70.1426136363637,68.4448863636364,67.83125,70.9607954545454],
            [new Date('2012-03-29 08:22:00'), 70.1375,68.3426136363637,67.775,70.9352272727273]
        ]);
    var options = {
    title: 'Temp Readings'    
    };
    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);
}
</script>
</head>
<body>
<div id="chart_div" style="width: 1024px; height: 768px;"></div>
</body>
</html>

【问题讨论】：

这是一个 jsFiddle：jsfiddle.net/Steve_Wellens/zMfFD

标签： javascript html internet-explorer firefox google-visualization

【解决方案1】：

尝试将“-”改为“/”

例如[new Date('2012-03-27 08:25:00'), 73,67,67,71] 到

[new Date('2012/03/27 08:25:00'), 73,67,67,71]

在我的 IE9 上工作。 :)

【讨论】：

那么，这是引发异常还是什么？
不，只是简单的点击和试用。 ;)
哦，是我用的替换功能出错了，火狐也可以

【解决方案2】：

来自文档：警告：您不能在同一页面上同时加载 linechart 和 corechart 包。

所以使用这条线：google.load("visualization", "1", {packages:["linechart"]});

这是一个有效的 jsFiddle：

http://jsfiddle.net/Steve_Wellens/X3UsB/

【讨论】：

正确。我只加载corechart。此代码（日期逻辑除外）直接取自谷歌折线图示例。