Chart dont get mysql data using json file, need to run json file first

[natasha11]

$(document).ready(function() {
var dataPoints = [];

var chart = new CanvasJS.Chart(“chartContainer”, {
animationEnabled: true,
exportEnabled: true,
theme: “light2”,
zoomEnabled: true,
title: {
text: “Attendance”
},
axisX: {
title: “Date”,
titleFontSize: 10
},
axisY: {
title: “Number of Present”,
titleFontSize: 10,

},
data: [{
type: “column”,
dataPoints: dataPoints
}]
});

function addData(data) {
var dps = data.attendance;
for (var i = 0; i < dps.length; i++) {
dataPoints.push({
x: new Date(dps[i][0]),
y: parseInt(dps[i][1])
});
}

chart.render();

}

$.getJSON(“http://localhost/fyp/results.json&#8221;, addData);

}

This would be my json file after running (results.json):
{“attendance”:[[1520809200000,”1″]]}

so, whenever i want to render the chart, i need to run “results.json” at the browse, then the chart will run according to the details in my mysql.
but i dont want to extra loading the “Results.json” file. i want it to render and get the data from mysql automatically. i dont know where do i wrong

[Vishwas R]

@natasha11,

Please take a look at this sample project for creating dynamic charts using data from MySQL database in PHP. Also, please refer to this documentation page for creating Dynamically Updating Charts from JSON API & AJAX.

If this doesn’t suit your requirements, kindly share a sample project with sample data over google-drive or onedrive so that we can understand it better and help you out.

—
Vishwas R
Team CanvasJS

[natasha11]

http://fkiattendance.xyz/staff_report.php

this is the link to my chart.

<script type=”text/javascript”>
window.onload = function () {
var chart = new CanvasJS.Chart(“chartContainer”,{
title:{
text:”Rendering Multi Series Chart from database”
},
data: [{
type: “column”,
dataPoints : [],
}]
});

$.getJSON(“report.php”, function(data) {
$.each((data), function(key, value){
chart.options.data[0].dataPoints.push({label: value[0], y: parseInt(value[1])});
});
chart.render();
updateChart();
});

function updateChart() {
$.getJSON(“report.php”, function(data) {
chart.options.data[0].dataPoints = [];
chart.options.data[1].dataPoints = [];
$.each((data), function(key, value){
chart.options.data[0].dataPoints.push({label: value[0], y: parseInt(value[1])});
});

chart.render();
});
}

setInterval(function(){updateChart()}, 1000);
}
</script>

it still wont come render.