Chartjs-Chat js with respose ajax

by

0👍

Okay, from what I can understand is, you want to fetch some data(JSON) from ajax and show it in your charts.
Well, it’s quite easy. You must have a data variable that basically contains labels and dataset list. Just fetch the JSON and put the corresponding data values in their respective place. Then run the window.myChart.update() function. This will update the chart with the new values.

var data = {                                            //The Default data
        labels: ['2001','2002','2003','2004','2005'],
        datasets: [{label: 'prices', borderWidth: 2, hoverBorderWidth: 2, backgroundColor: "rgba(0,128,128,0.5)", data: [10,30,10,50,20], borderColor: "rgba(0,128,128,1)",}] };


var ctx1 = document.getElementById('canvas3').getContext('2d');
window.myChart = new Chart(ctx1, {
                    type: 'radar', data: data,
                    options: {responsive: true, scales:{yAxes:[{ticks:{beginAtZero:true}}],xAxes: [{gridLines: {color: "rgba(0,0,0,0)",}}]}, legend: {position: 'top'}, title: {display: true,text: 'Charts'}}
                });

//Now change the data list in the data.datasets[0] to the data of JSON file.

window.myChart.update()

Leave a comment