Как отобразить данные в реальном времени HighCharts Line Graph, которые получает API?

Question

У меня есть сервер Node.js с Rest Apis. И клиентское приложение на основе Angula5, которое потребляет эти серверные Apis. Теперь я хочу реализовать графики в реальном времени, на которых я хочу показать эффект данных в реальном времени. Как мой API, из которого я получаю данные

/api/gateway/getGraphData

Как я могу показать данные в реальном времени? Данные поступают в каждую секунду в фоновом режиме. Так должен ли я запускать задание crone с моей конечной точкой в ​​приложении Angular, чтобы получать данные при каждом вызове задания crone и связывать эти данные с диаграммой?

Answer 1

Вы можете попробовать что-то вроде этого. Вызов AJAX для извлечения данных, которые загружаются при загрузке диаграммы. Это будет непрерывно извлекать данные с определенным интервалом времени.

function fetchData() {
    $.ajax({
        url: 'https://SOME_JSON_URL_HERE.com/',
        success: function(data) {
            var series = chart.series[0],
                shift = series.data.length > 20;
            chart.series[0].addPoint(data.xValue, true, shift);      
            setTimeout(fetchData, 8000);
        },
        cache: false
    });
}


chart = new Highcharts.Chart('container', {
    chart: {
        type: 'spline',
        events: {
            load: fetchData
        }
    }
});