Google 饼图未在 IE <= 8 中显示答案

【问题标题】：Google Pie chart not displaying in IE <= 8Google 饼图未在 IE <= 8 中显示
【发布时间】：2020-03-21 23:49:51
【问题描述】：

我需要为不同的IE版本执行这个.php文件，但是当我模拟到时出现以下错误：

IE 8：“gvjs_VL”未定义。
IE

当IE版本为

提前谢谢你。 :)

<!DOCTYPE html>
<?php 
$chartData = array(array("Area" , "Number of people"),
                   array("A"    , 5000),
                   array("B"    , 8000),
                   array("C"    , 400),
                   array("D"    , 40000),
                   array("E"    , 1000),
                   array("F"    , 1400 ));  
?>

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" >
    <link rel="stylesheet" href="main.css">
</head>
<body>

<div class="chartContainer">
    <div id="piechart" class="piechart">
        <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

        <script type="text/javascript">
        // Load google charts
        google.charts.load('current', {'packages':['corechart']});
        google.charts.setOnLoadCallback(drawChart);

        // Draw the chart and set the chart values
        function drawChart() {
          var data = google.visualization.arrayToDataTable( <?php echo json_encode($chartData, JSON_NUMERIC_CHECK); ?>);

          // Optional; add a title and set the width and height of the chart
          var options = {fontName:'Arial', legend:{position: 'labeled', maxLines:15, alignment:'start'}, 
                         textStyle: {color: 'black', fontSize: 30}, 
                         pieHole: 0.4, sliceVisibilityThreshold:0.0,
                         chartArea: {   
                                     width: "100%",
                                     top: "0%",
                                     left: "0%"},

                         };

          // Display the chart inside the div> element with id="piechart"
          var chart = new google.visualization.PieChart(document.getElementById('piechart'));
          chart.draw(data, options);
        }
    </script>
    </div>

</div>
</body>

【问题讨论】：

来自docs：Why do my charts work in some browsers but not all? [...] With Google Charts, there are sometimes problems in Internet Explorer 8 and earlier。连微软都不支持IE8了。
微软这些天甚至懒得支持 IE10。谷歌当然不会。 microsoft.com/en-us/microsoft-365/windows/end-of-ie-support
我认为它与旧版本 IE 中不包含的 json 有关。非常感谢您的澄清

标签： php internet-explorer web-applications emulation google-visualization

【解决方案1】：

我无法运行您的 PHP 代码，因此我尝试使用 JS 测试 Google 图表示例。

<!DOCTYPE html>
<html lang="en-US">
<body>

<h1>My Web Page</h1>

<div id="piechart"></div>

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

<script type="text/javascript">
// Load google charts
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);

// Draw the chart and set the chart values
function drawChart() {
  var data = google.visualization.arrayToDataTable([
  ['Task', 'Hours per Day'],
  ['Work', 8],
  ['Eat', 2],
  ['TV', 4],
  ['Gym', 2],
  ['Sleep', 8]
]);

  // Optional; add a title and set the width and height of the chart
  var options = {'title':'My Average Day', 'width':550, 'height':400};

  // Display the chart inside the <div> element with id="piechart"
  var chart = new google.visualization.PieChart(document.getElementById('piechart'));
  chart.draw(data, options);
}
</script>

</body>
</html>

IE浏览器输出：

如果您查看源代码，您会注意到 Google Charts 在其图表中使用 SVG。 SVG 在 IE

参考：

SVG (basic support)

这可能是它在 IE

目前不支持 IE 8 及更早的版本。建议升级到 IE 11 浏览器。它可以帮助避免这个问题。

【讨论】：

我很抱歉，我真的不知道为什么你不能运行它，因为我基本上上传了我拥有它（并且适用于我）。不管怎样，非常感谢您的回答和建议！