[Chartjs]-How to create Bar chart that gets updated from new ajax requests with ChartJS?

by

1👍

This is an asynchronous vs synchorous error. This tutorial may help a bit.

Take a look at this part of the code:

function barData(url){
    let data_labels = [];
    let data_values = [];
    $.ajax({
        url: url,
        type: 'GET',
        async: false,
        success: function(bar_data){
            data_labels= bar_data.labels;
            data_values= bar_data.values;
        }
    })
    return {data_labels,data_values};
}

The return {data_labels,data_values}; is actually happening before the $.ajax call. If you want to return the results from the server this line should be inside the success function of the ajax call. Take a look at this question where the OP has the same issue.

About updating a Chart, here is a demo with a mocked server response that updates its values each second: https://codepen.io/adelriosantiago/pen/YzpNLbd

Leave a comment