I’m using the example copied directly from the web page: “Live Updating Charts from JSON API & AJAX”
I’ve put it on my apache server.
It doesn’t seem to work.
I just get a blank page.
I cut and copied the text below directly from the example on the page. i’ve even tried setting CORS. HELP!!!
—–
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
window.onload = function() {
var dataPoints = [];
var chart;
$.getJSON("https://canvasjs.com/services/data/datapoints.php?xstart=1&ystart=10&length=10&type=json", function(data) {
$.each(data, function(key, value){
dataPoints.push({x: value[0], y: parseInt(value[1])});
});
chart = new CanvasJS.Chart("chartContainer",{
title:{
text:"Live Chart with dataPoints from External JSON"
},
data: [{
type: "line",
dataPoints : dataPoints,
}]
});
chart.render();
updateChart();
});
function updateChart() {
$.getJSON("https://canvasjs.com/services/data/datapoints.php?xstart=" + (dataPoints.length + 1) + "&ystart=" + (dataPoints[dataPoints.length - 1].y) + "&length=1&type=json", function(data) {
$.each(data, function(key, value) {
dataPoints.push({
x: parseInt(value[0]),
y: parseInt(value[1])
});
});
chart.render();
setTimeout(function(){updateChart()}, 1000);
});
}
}
</script>
<script type="text/javascript" src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="https://cdn.canvasjs.com/canvasjs.min.js"></script>
</head>
<body>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
</body>
</html>