Highcharts и данные по загрузке через Ajax

Question

Просто начинайте работу с Highcharts и надеясь, что проблема, с которой я сталкиваюсь, - это нечто относительно простое/глупое, что мне не хватает.

Я взял образец из Highcharts жить обновления демо - http://www.highcharts.com/demo/dynamic-update

и модифицирован только часть данных серии тянуть «реальные» данные:

Оригинального код:

series: [{ 
    name: 'CPU utilization', 
    data: (function() { 
     // generate an array of random data 
     var data = [], 
     time = (new Date()).getTime(), 
     i; 
     for (i = -279; i <= 0; i++) { 
     data.push({ 
      x: time + i * 1000, 
      y: Math.random() * 10 
     }); 
     } 
     return data; 
    })() 
    } 
] 

Заменено :

series: [{ 
    name: 'CPU utilization', 
    data: (function() { 
     $.ajax({ 
     url: '/api/data/query', 
     data: query, 
     content: "application/json", 
     type: "POST", 
     success: function (point) { 
      var vals = point.queries[0].results[0].values; 
      var data = [], 
      i; 
      for (i = -vals.length + 1; i <= 0; i++) { 
      data.push({ 
       x: vals[i + vals.length - 1][0], 
       y: vals[i + vals.length - 1][1] 
      }); 
      } 
      return data; 
     } 
     }); 
    })() 
    } 
] 

Формат вывода данных выглядит id entical для случайных и реальных:

Случайные:

Array[280] 
[0 … 99] 
0: Object 
x: 1365259804521 
y: 9.2204492539 

Real:

Array[280] 
[0 … 99] 
0: Object 
x: 1365259979000 
y: 3 

Однако, при попытке использовать реальные данные, я получаю Highcharts ошибки:

Uncaught TypeError: Cannot call method 'push' of undefined highcharts.js:199 
P.addPoint highcharts.js:199 
$.ajax.success test2.html:265 
c jquery-1.9.1.min.js:3 
p.fireWith jquery-1.9.1.min.js:3 
k jquery-1.9.1.min.js:5 
r 

Любые предложения о том, где искать? Я уверен, что это то, что я делаю, поскольку это должно быть довольно рутиной.

Answer 1

«Данные» выходит за пределы области видимости, поэтому немедленный вызов функции не возвращает никаких данных. Объявите данные var data сильное текстовое окно вызова ajax. Что-то вроде этого:

(function() { 
    var data = []; 
    $.ajax({ 
    url: '/api/data/query', 
    ... 
    ... 
})(); 

Answer 2

Так это то, что в конечном итоге работает:

series: [{ 
     name: 'CPU utilization', 
     data: (function() { 
         var data; 
         $.ajax({ 
         url: '/api/data/query', 
         data: query, 
         async: false, 
         content: "application/json", 
         type: "POST", 
         success: function(point) { 
         data = point.queries[0].results[0].values; 
         } 
         }); 
      return data; 
     })() 
    }] 

Я подозреваю, что «асинхронной ложь» не будет нужен, если я двигаю поиск данных в своей собственной функции?