Как можно обновить график с новыми данными?

Question

Я ищу подходящий способ обновить гистограмму, которая постоянно получает данные от API.

$http({ 
    method: 'GET', 
    url: '/data' //getting data from API 
}).then(function (json) { 
    //chart 
} 

Существует аналогичная ситуация на plunker, но я напуган утечки памяти с помощью этого метода и диаграмма всегда мигает.

У кого-нибудь есть предложение, что использовать вместо интервала? Или использовать его каким-то другим способом?

Спасибо.

Answer 1

Это Plunker является большим, но проблема заключается в том, что она вызывает c3.generate непрерывно, поэтому это утечка памяти и мигает (вы, по сути создание нового экземпляра C3 графике каждый раз, когда вы запускаете generate, все это делает, называется new Chart(config);)

Что вам нужно сделать, это создать экземпляр C3 в контроллере, а затем позвонить c3.load() в свой звонок $http.

Updated Plunker

бит ключа:

$interval(function() { 
    $http.get('chartData.json') 
     .then(function(json) { 
     $scope.countries = formatData(json.data); // format received data 
     $scope.chart.load({json: $scope.countries, keys: { value: ['Croatia', 'Belgium', 'Argentina'] }}); 
     }); 
    }, 1000); 

$interval+$http комбо должен работать нормально, при условии, что JSON-файл вы загружаете только на CDN где-нибудь (если он генерируется на ослабленным запросите базу REST API, вы либо получите дросселирование, либо ополосните свой сервер). Вы можете взглянуть на $http's caching docs.