Живое обновление графиков ajax

Question

У меня есть веб-сайт, который обслуживает около 20-50 виджетов в секунду, и я хотел создать диаграмму, которая автоматически получает данные с сервера, а затем обновляет диаграмму, и я хочу, чтобы диаграмма работала справа налево, поскольку больше данныхдобавлены и удалены старые значения и добавлены новые значения.Я хотел бы получить решение javascript и php.

Я пробовал Google и не могу найти никаких решений для этого, и однажды я нашел учебник, но теперь я потерял эту ссылку :( Так что любая помощь в формессылка, фрагмент кода или то, что нужно искать, поможет.

Одна вещь, которую я хотел, - это чтобы виджет запускался с задержкой выборки данных, но начинал отображать данные после 5 секунд первоначальной выборки, а затем извлекатьданные каждые 2 секунды, однако загружайте данные каждую секунду.Это облегчит нагрузку на сервер, одновременно генерируя гладкие графики.

Любая помощь будет принята с благодарностью ....

что-то вроде этого для php http://support.nevron.com/KB/a175/implement-real-time-chart-in-aspnet-application-using-ajax.aspx

Answer 1

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

function runChart() {
  var dataObject = [];

  fetchFromServer = function() {
    //Make your Ajax call here
    //and then update 'dataObject'
  }

  //set fetchFromServer to fire every 5 seconds
  setInterval( function () { fetchFromServer() }, 5000 ); 

  loadToChart = function() {
    //In here keep track of what was the last data you added to the chart
    //pull data-points from 'dataObject' 
    //and display the next data-point on the graph
  }
  //set loadToChart to fire every second
  setInterval( function () { loadToChart() } ,1000); 
}