Uncaught ReferenceError: Chart is not defined

[rijans]

Here's my JS from inspection code:

<script> document.addEventListener("DOMContentLoaded", function(event) { (function() { "use strict"; let ctx = document.getElementById("pneJMhCKKPK"); window.pneJMhCKKPK = new Chart(ctx, { type: 'doughnut', data: { labels: ["Reminder for Monthly Bill (Recurrent Bill)","Password Reset","Device Offline","Car Showing Wrong Location","Invoice Request","Payment Sent","Payment Process Request","Connection Open after Bill Payment","Sales ","Cannot login to App","Not getting App Notifications","Wants to upgrade Device Type","Call Not Receiving from Device","Cannot See Playback ","Device De Install and Re Install","Connection Close for No Payment","Platform Expiry Date cannot be set","Cannot see car from App\/Web","Did not get Expiry SMS and Email","Expiry Date Update","Device off line","Not Getting Geofence Alerts","Car Engine not starting","Not Getting Over-speed Alerts","Wants to discontinue our Service"], datasets: [{"backgroundColor":["#8b520f","#8b5266","#8b52b7","#8b5306","#8b5355","#8b53a3","#8b53f2","#8b5455","#8b54b9","#8b5501","#8b553e","#8b5581","#8b55c1","#8b55ff","#8b563c","#8b567b","#8b56b9","#8b56f7","#8b5735","#8b5783","#8b57c9","#8b5812","#8b585a","#8b58a2","#8b58ea"],"hoverBackgroundColor":["#8b520f","#8b5266","#8b52b7","#8b5306","#8b5355","#8b53a3","#8b53f2","#8b5455","#8b54b9","#8b5501","#8b553e","#8b5581","#8b55c1","#8b55ff","#8b563c","#8b567b","#8b56b9","#8b56f7","#8b5735","#8b5783","#8b57c9","#8b5812","#8b585a","#8b58a2","#8b58ea"],"data":[43,25,24,9,7,7,7,6,5,5,4,3,3,2,2,2,2,2,2,1,1,1,1,1,1]}] }, options: {"legend":{"display":true,"labels":{"fontColor":"#000"}}} }); })(); }); </script>

[jcmontejo]

I had the same problem and after a long time I discovered the cause. I was declaring the library like this:

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>

It was me taking out the "min" and it worked. It was like this.

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.js"></script>

[johnpaulada]

I think this is a ChartJS problem. I've experienced this before. Drove me nuts.

[mahassan]

I had the same problem and after a long time I discovered the cause. I was declaring the library like this:

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>

It was me taking out the "min" and it worked. It was like this.

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.js"></script>

Thank you so much, I spend whole day trying to figure what was wrong. The dev team for chartsjs shld fix it.

[mgmgmogumi]

Chartの呼び出しを即時関数で行うことでもこの問題を回避できました。

$(function (){
    var myChart = new Chart(ctx, config);
});

[fasi1208]

I had the same problem and after a long time I discovered the cause. I was declaring the library like this:

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>

It was me taking out the "min" and it worked. It was like this.

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.js"></script>

how to solve it in yii2? I am using chart like this `use practically\chartjs\Chart;

echo Chart::widget([ 'type' => Chart::TYPE_BAR, 'datasets' => [ [ 'data' => [ 'Label 1' => 10, 'Label 2' => 20, 'Label 3' => 30 ] ] ] ]);`