Question

当我加载我的2个图表时，我收到此错误消息“无法读取未定义的Google图表的属性'0'”，并且只有在我第一次加载页面时才会出现此错误消息。如果我点击铬上的F5，他们正确加载。如果我调整浏览器大小，它们会正确加载。可能是什么问题呢？ IE显示此错误一次，Chrome每次首次打开页面时都会显示此错误。有时我加载页面时出现此错误：

0x800a138f - JavaScript运行时错误：无法获取未定义或空引用的属性“arrayToDataTable”

请参阅下面的代码：

<script src="../Scripts/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">

  google.charts.load('current', { 'packages': ['corechart'] });
  google.charts.setOnLoadCallback(drawChart1);

  google.charts.load('current', { 'packages': ['corechart'] });
  google.charts.setOnLoadCallback(drawChart2);

  $(window).resize(function () {

    if (width != $(window).width() || height != $(window).height()) {  //only refresh if screen size changes
            drawChart1();
            drawChart2();

            width = $(window).width();
            height = $(window).height();
    }
    });

    $(document).ready(function () {

        width = $(window).width();
        height = $(window).height();
    });

    function drawChart1() {

        var data = google.visualization.arrayToDataTable([
                    ['Minute', 'Users'],
                    ['0 Min', 9],
                    ['1 Min', 28],
                    ['2 Min', 1],
                    ['3 Min', 1],
                    ['5 Min', 1]
                ]);

        var options = {
                    slices: {
                        0: { offset: 0.2 }
                    },

                    chartArea: { 'left': '5%', 'top': '10%', 'width': '100%', 
                 'height': '100%' }
                };


        var chart = new 
               google.visualization.PieChart(document.getElementById('graph1'));
                chart.draw(data, options);
            }

    function drawChart2() {


            var data = google.visualization.arrayToDataTable([
                    ['Minute', 'Users'],
                    ['0 Min', 20],
                    ['4 Min', 4],
                    ['5 Min', 1],
                    ['8 Min', 8],
                    ['10 Min', 3]
                ]);

            var options = {
                    // title: 'Group C Users'
                    pieHole: 0.5,
                    chartArea: { 'left': '5%', 'top': '10%', 'width': '100%', 
                              'height': '100%' }
                };

            var chart = new 
               google.visualization.PieChart(document.getElementById('graph2'));
                chart.draw(data, options);
     }

Answer 1

首先，您可以删除jsapi，它已不再使用...

<script type="text/javascript" src="http://www.google.com/jsapi"></script>

接下来，您只需要拨打google.charts.load一次，
您还可以在加载语句中包含callback。

尝试替换此...

google.charts.load('current', { 'packages': ['corechart'] });
google.charts.setOnLoadCallback(drawChart1);

google.charts.load('current', { 'packages': ['corechart'] });
google.charts.setOnLoadCallback(drawChart2);

有了......

google.charts.load('current', {
  packages: ['corechart'],
  callback: function () {
    drawChart1();
    drawChart2();
  }
});

无法读取未定义的Google图表

1 个答案: