Google setOnLoadCallback 和 Ajax

Question

我正在使用 ajax 来点击通过 Node.js/Express 服务于 Json 的 URL。 Json 返回正常，我已经测试过了。它接收到的数据应该使用 Google Chart API 绘制在图表中（如果数组是硬编码的，这可以正常工作）。

我收到了 4 个意外 'Uncaught typeErrors' 并希望能指出正确的方向。

非常感谢和欢迎您的帮助！

这是有问题的代码（我认为）

 <!-- <script>
            var nData;
        $(document).ready(function() {
            $.ajax({
                url: 'http://localhost:3000/renderedJson',
                type: 'GET',
                dataType: 'json',
                data: [],
                success:function(data){
                nData = data;
                console.log("success");
                console.log(nData);
                }
            })
            .done(function() {
                console.log("done");
                getData();
            })
            .fail(function() {
                console.log("error");
            })
            .always(function() {
                console.log("complete");
            });
            });
        </script>

Here is an example (with hard coded data, working! To see, comment the ajax request and uncomment the hardcoded variable)

更新 - 这是我的有效负载，从 URL 我通过 Express / Node 设置（调用 MongoDB 实例）

[{"_id":"559c27abe01e815c0f7b69d3","date":"2015-01-2","one":[{"a":9},{"b":8},{"c":7},{"d":6},{"e":5},{"f":4},{"g":3}],"two":[{"h":2},{"i":1}]},{"_id":"559c27abe01e815c0f7b69d2","date":"2015-01-1","one":[{"a":1},{"b":2},{"c":3},{"d":4},{"e":5},{"f":6},{"g":7}],"two":[{"h":8},{"i":9}]}]

更新经过进一步调试，我相信下面的代码不会触发。

 google.setOnLoadCallback(function() {
console.log('loaded google 1');
drawChart(cols, rows);
console.log('loaded google 2');
});

Answer 1

getData() 函数未定义数据。您当前发布的代码不完整。查看您的 fiddle 函数 getData 和 drawChart 之间有一条线： getData();
在 ajax 调用完成之前立即调用您的 getData 函数。删除此行，它应该可以工作。

很难看出那张照片上的错误。
上面的错误图片与错误发生的地方有关显示你的 ajax 不足以调试问题（只是为了将来参考）
如果事物未定义，检查它们是个好主意在抛出错误的函数中。在这种情况下，如果你在 getData 中记录 nData 它可能会输出 undefined - 这可能会导致问题的根源。

编辑

    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
    google.load('visualization', '1.1', {packages: ['line']});

然后代替

google.load('visualization', '1.1', {packages: ['line']});
google.setOnLoadCallback(function() {
    drawChart(cols, rows);
});

就拥有：

drawChart(cols, rows);

Google setOnLoadCallback 和 Ajax

Google setOnLoadCallback and Ajax

javascript

ajax

jquery

json

google-visualization