排行榜与jQuery.ajax：如何初始化/范围问题

Question

我相当关于JS新手，所以这可能是一个愚蠢的问题...

我尝试做一个排行榜主/图（见样品http://jsfiddle.net/VhqaQ/）。该data阵列应该充满jQuery.ajax电话：

$(function() { 

    var masterChart, 
     detailChart, 
     data=[], 
     chatter=[], 
     indizies=[]; 

    $(document).ready(function() { 

     $.ajax({ 
      url: 'index.php', 
      data: 'type=1363435001', 
      dataType: 'json', 
      success: function(json) { 
       data = json.range; 
       scatter = json.scatter; 
       indizies = json.indizies; 

      }, 
      error: function (xhr, status, error) { 
       alert('Status: ' + status +' Error: ' + error); 
      } 
     }); 

     // create the master chart 
     function createMaster() { 
      masterChart = new Highcharts.Chart({ 

      ....... 
       series: [{ 
        type: 'columnrange', 
        name: 'Intervall', 
        pointInterval: 1, 
        pointStart: 0, 
        data: data 
       }], 
      }); 
     } 

      ........ 

     createMaster(); 
    }); 
}); 

但是像这样的图表保持为空。这是data阵列的范围问题吗？或者当new Highcharts.Chart(...)被调用时，data尚未初始化？

我测试了ajax部分 - 数据填写正确。所以这不是问题...

也许我应该把ajax调用的其他地方？

Answer 1

在$ .ajax调用的回调函数中调用createMaster（）并将其传递给数据。 您目前假设在初始化ajax调用时返回了数据，这很可能不是这种情况。将函数调用放在回调函数内，确保数据存在。

$.ajax({ 
    url: 'index.php', 
    data: 'type=1363435001', 
    dataType: 'json', 
    success: function(json) { 
     data = json.range; 
     scatter = json.scatter; 
     indizies = json.indizies; 

     createMaster(data); 
    }, 
    error: function (xhr, status, error) { 
     alert('Status: ' + status +' Error: ' + error); 
    } 
}); 

// create the master chart 
    function createMaster(data) { 
     masterChart = new Highcharts.Chart({ 

     ....... 
      series: [{ 
       type: 'columnrange', 
       name: 'Intervall', 
       pointInterval: 1, 
       pointStart: 0, 
       data: data 
      }], 
     }); 
    }