I'm trying to create a chart using CanvasJS but I'm getting the following error:
Uncaught TypeError: b[a].render is not a function
w.render @ canvasjs.min.js:84
Aa.Chart.render @ canvasjs.min.js:412
window.onload @ statistics:107
The code is the example code found on their website:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
window.onload = function () {
var chart = new CanvasJS.Chart("chartContainer",
{
title:{
text: "Number of Students in Each Room"
},
axisX:{
title: "Rooms"
},
axisY:{
title: "percentage"
},
data: [
{
type: "stackedColumn100",
legendText: "Boys",
showInLegend: "true",
indexLabel: "#percent %",
indexLabelPlacement: "inside",
indexLabelFontColor: "white",
dataPoints: [
{ y: 40, label: "Cafeteria"},
{ y: 10, label: "Lounge" },
{ y: 72, label: "Games Room" },
{ y: 30, label: "Lecture Hall" },
{ y: 21, label: "Library"}
]
},
{
type: "stackedColumn100",
legendText: "Girls",
showInLegend: "true",
indexLabel: "#percent %",
indexLabelPlacement: "inside",
indexLabelFontColor: "white",
dataPoints: [
{ y: 20, label: "Cafeteria"},
{ y: 14, label: "Lounge" },
{ y: 40, label: "Games Room" },
{ y: 43, label: "Lecture Hall" },
{ y: 17, label: "Library"}
]
}
]
});
chart.render();
}
</script>
<script type="text/javascript" src="/assets/script/canvasjs.min.js"></script></head>
<body>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
</body>
</html>
I've tried the same code on my machine and it's working fine, but when I upload it to my server, then I'm getting the previously mentioned error.
Does anyone has any idea what is wrong here?
Thanks!