[Chartjs]-How populate chart.js with sql data?

by

3👍

✅

json_encode() produces a JSON string. You need to parse this with JSON.parse() before you can use it.

$.ajax({
    type: 'POST',
    url: 'templates/getdata.php',
    success: function (data) {
        lineChartData = JSON.parse(data); //parse the data into JSON

        var ctx = document.getElementById("OmzetChart").getContext("2d");
        var myLineChart = new Chart(ctx, {
            type: 'line',
            data: lineChartData
        });
    }
});

Also, using $.ajax() method’s dataType parameter, you can leave this parsing to jQuery.

$.ajax({
    type: 'POST',
    url: 'templates/getdata.php',
    dataType: 'json', //tell jQuery to parse received data as JSON before passing it onto successCallback
    success: function (data) {
        var ctx = document.getElementById("OmzetChart").getContext("2d");
        var myLineChart = new Chart(ctx, {
            type: 'line',
            data: data //jQuery will parse this since dataType is set to json
        });
    }
});

Leave a comment