Question

我使用以下代码请求json文件并解析它

google.load('visualization', '1', {packages: ['controls', "motionchart", "table"]});
google.setOnLoadCallback(function(){
createTable($('#chart_div').width(),400);
})
var jsonData;
$.ajax({
 url: shapingTomorrowDataUrl,
 dataType: "json",
 async: true,
 success: function(data) {
  console.log("Data done");
  jsonData=data;
  createTable($('#chart_div').width(),400);
  }
});

现在我最初使用了对json文件的同步调用，它运行得很好。但现在我的客户希望在读取数据时播放加载程序gif。同步请求导致gif挂起很多。但我的异步请求问题是，在用户第一次打开我的仪表板时，在解析json数据之前会调用图表函数。我稍微更改了代码以在成功函数中调用函数并注释回调函数。

但是这会导致弹出以下错误：

未捕获的TypeError：无法读取属性＆＃39; DataTable＆＃39;未定义的

在以下行中：

var chartData = new google.visualization.DataTable();

所以从本质上讲，我的代码只能在第一次尝试后才能工作，即我在json文件存储在缓存中之后进行猜测。在第一次尝试期间，加载程序gif继续播放而不会绘制图表。非常感谢有关如何解决它的一些建议。

Answer 1

等到回调完成后才进行$.ajax来电...

var jsonData;
google.load('visualization', '1', {packages: ['controls', "motionchart", "table"]});
google.setOnLoadCallback(function(){
  $.ajax({
   url: shapingTomorrowDataUrl,
   dataType: "json",
   async: true,
   success: function(data) {
    console.log("Data done");
    jsonData=data;
    createTable($('#chart_div').width(),400);
    }
  });
});

异步Json请求不使用谷歌动态图表

1 个答案: