javascript - Javascript Google Chart 中未填写 Chartdata 变量

Question

在我的 Google Chart 脚本中填写我的图表数据时遇到了一些问题。首先，我有 1 个场景并正确填写。但是后来我想添加另一个场景来填充我的图表数据变量，但现在它不会被填充（准时）。

我尝试了一些事情，看起来我的脚本在我的图表数据数组完全填充之前会快速运行，然后它开始向我显示我的图表（由于还没有数据而出现错误）

添加/更改开始的最佳方法是什么

var data = google.visualization.arrayToDataTable(chartdata);

当我的 for 循环完成时。

这是我的代码：

<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(drawChart);
    function drawChart(file) {
        var chartdata = [];
        var header = ["Tijd", "Bezoekers", { role: "style" }];
        chartdata.push(header);
        if (file.value.slice(file.value.length - 12) === "vandaag.json" ) { 
            var d = new Date();
            var tijd = d.getHours();
            for (var i = 0; i < tijd; i++) {
                if ( i < 10 ) { hour = "0"+ i; }
                else { hour = i; }
                read_file = file.value.substring(0,file.value.length-5)+ "/"+ hour+ ".json";
                $.getJSON(read_file, function(obj) { 
                    var temp = [JSON.stringify(obj[0]["datetime"]).substr(11,6) , Number(JSON.stringify(obj[0]["COMBINED COUNT"][2])) , "blue"];
                    chartdata.push(temp);
                });
            }   
        alert(chartdata);           
        }
        else {
            $.getJSON(file.value, function(obj) {
                for (var i = 0; i < obj.length; i++) {
                    var temp = [JSON.stringify(obj[i]["datetime"]).substr(11,6) , Number(JSON.stringify(obj[i]["COMBINED COUNT"][2])) , "blue"];
                    chartdata.push(temp);
                }
            }); 
        alert(chartdata);
        }
......it has to wait here/check till my chartdata is filled......
        var data = google.visualization.arrayToDataTable(chartdata);
        var view = new google.visualization.DataView(data);
        view.setColumns([0, 1,
                       { calc: "stringify",
                         sourceColumn: 1,
                         type: "string",
                         role: "annotation" },
                       2]);

        var options = {
            title: "Bezoekersaantal per uur",
            width: 1500,
            height: 600,
            bar: {groupWidth: "60%"},
            legend: { position: "bottom" },
            vAxis: { format: 0 },
        };
        var chart = new google.visualization.ColumnChart(document.getElementById("chart"));
        chart.draw(view, options);
}
  </script>

标签： javascriptvariablescharts