Hello,
My json data looks like this;
[{“platform”: “IPTV”, “value__sum”: “100000.00”}, {“platform”: “metro”, “value__sum”: “32141302.50”}, {“platform”: “METRO E”, “value__sum”: “39231261.70”}, {“platform”: “EDGE”, “value__sum”: “74179073.63”}, {“platform”: “SYSTEM”, “value__sum”: “135498372.85”}, {“platform”: “IPCORE”, “value__sum”: “467810178.41”}]
and script as below:
<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function() {
var dataPoints = [];
var options = {
animationEnabled: true,
theme: "light2",
title: {
text: "Contract Value of Platform"
},
// axisX: {
// valueFormatString: "string",
// },
axisY: {
title: "$",
titleFontSize: 24,
includeZero: false
},
data: [{
type: "spline",
yValueFormatString: "$#,###.##",
dataPoints: dataPoints
}]
};
function addData(data) {
for (var i = 0; i < data.length; i++) {
dataPoints.push({
label:data[i].platform,
y: data[i].value__sum
});
console.log(data)
}
console.log(data)
$("#chartContainer").CanvasJSChart(options);
}
$.getJSON("http://127.0.0.1:8000/json/", addData);
}
</script>
</head>
<body>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
<script src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script>
<script src="https://cdn.canvasjs.com/jquery.canvasjs.min.js"></script>
</body>
</html>
I’m unable to plot the chart even though data already captured in console.
Appreciate if you could fix the code.
Thank you very much