Error with Chart.js : TypeError: t is undefined
Solution 1
Solved, apparently the script link I was using was bugged. Changed it to https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js and it works fine. See Chris G
's comment.
Solution 2
Put the javascript code (start with <script type="text/javascript">var ctx ...</script>
) after the canvas element. This ensures that the canvas element is already present at the time when it gets referenced by var ctx = document.getElementById("myChart");
This should solve your problem.
Related videos on Youtube
Hachem Benyahia
Updated on June 04, 2022Comments
-
Hachem Benyahia almost 2 years
I keep getting this error and I wasn't able to display a Chart.js chart yet, although I have tried multiples codes I found on the internet.
Here is the relevant part of the HTML :
<head> <script src = "https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.min.js"></script> ... </head> <body> <canvas id = "myChart"></canvas> ... </body>
Here is the javascript :
var ctx = document.getElementById("myChart"); var myChart = new Chart(ctx, { type: 'bar', data: { labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"], datasets: [{ label: '# of Votes', data: [12, 19, 3, 5, 2, 3], backgroundColor: [ 'rgba(255, 99, 132, 0.2)', 'rgba(54, 162, 235, 0.2)', 'rgba(255, 206, 86, 0.2)', 'rgba(75, 192, 192, 0.2)', 'rgba(153, 102, 255, 0.2)', 'rgba(255, 159, 64, 0.2)' ], borderColor: [ 'rgba(255,99,132,1)', 'rgba(54, 162, 235, 1)', 'rgba(255, 206, 86, 1)', 'rgba(75, 192, 192, 1)', 'rgba(153, 102, 255, 1)', 'rgba(255, 159, 64, 1)' ], borderWidth: 1 }] }, options: { scales: { yAxes: [{ ticks: { beginAtZero:true } }] } } });
I found that example here : http://www.chartjs.org/docs/
And I get this error in the console :
TypeError: t is undefined
Can someone help please ? Thanks.
-
ChrisG over 7 yearsThe code you posted is fine: jsfiddle.net/bd6Lf88a The problem must be somewhere else. Scratch that; you need to include the latest version:
https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.bundle.js
-