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

Question

我需要针对不同的IE版本执行此.php文件，但是当我模拟以下内容时会出现以下错误：

IE 8：“ gvjs_VL”未定义。
IE <8：“ JSON”未定义。

当IE版本为<= 8时，我也尝试过使用json2，但它不能解决问题。可能会发生什么？

谢谢你。：）

<!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>

Answer 1

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

<!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。 IE <= 8中不支持SVG。

参考：

SVG (basic support)

这可能是它不能在IE <= 8版本中工作的原因之一。

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

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

问题描述投票：0回答：1

1个回答

最新问题

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

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1