ReferenceError: Wykres nie jest zdefiniowany - chartjs

Czy jest błąd z Chart.js? Za każdym razem, gdy dodaję którykolwiek z wykresów w Chart.js do mojej witryny, pojawia się błąd, ale kiedy użyłem wykresu jako samodzielnego programu, działa on płynnie bez błędów. Używam HTML5.ReferenceError: Wykres nie jest zdefiniowany - chartjs

<html> 
    <head> 
     <meta charset="utf-8" /> 
     <title>Rice Consumption</title> 
     <script src='Chart.min.js'></script> 
    </head> 
    <body> 

     <canvas id="rice" width="600" height="400"></canvas> 

     <script> 
     var riceData = { 
     labels : ["January","February","March","April","May","June"], 
     datasets : 
     [ 
      { 
       fillColor : "rgba(172,194,132,0.4)", 
       strokeColor : "#ACC26D", 
       pointColor : "#fff", 
       pointStrokeColor : "#9DB86D", 
       data : [203000,15600,99000,25100,30500,24700] 
      } 
     ] 
     } 

      var rice = document.getElementById('rice').getContext('2d'); 
       new Chart(rice).Line(riceData); 
    </script> 
    </body> 
    </html>

SOLVED: Właśnie oddzielona skrypt z elementu canvas (wykonane inny plik skryptu do realizacji jego funkcji).

aktualizowane HTML: plik

 <html> 
     <head> 
     <meta charset="utf-8" /> 
     <title>Rice Consumption</title> 
     <script src='Chart.min.js'></script> 
     </head> 
     <body> 
     <canvas id="rice" width="600" height="400"></canvas> 
     <script src='Chart.min.js'></script> 
     <script src='rice.js'></script> 
     </body> 
     </html>

New JavaScript:

var riceData = { 
    labels : ["January","February","March","April","May","June"], 
    datasets : [ 
     { 
      fillColor : "rgba(172,194,132,0.4)", 
      strokeColor : "#ACC26D", 
      pointColor : "#fff", 
      pointStrokeColor : "#9DB86D", 
      data : [203000,15600,99000,25100,30500,24700] 
     } 
    ] 
} 

var rice = document.getElementById('rice').getContext('2d'); 
new Chart(rice).Line(riceData);

Źródło

2015-04-22 iWantToLearn

Proszę dodać jakieś szczegóły, jak dokładnie masz połączonych ChartJS. Gdzie jest tag '

1) Próbowałem Chart.js pobraną z Chartjs.org. Ale to nie działa.

2) Spróbuj tego.

<script type="text/javascript" src="http://www.chartjs.org/assets/Chart.js"> 
</script>

Działa dobrze.

Źródło

2016-03-18 01:47:05

Nowy sposób dodawania to przez CDN: – Sharpy35

Otrzymałem również ten sam błąd. Aby to naprawić, przeniosłem skrypt do oddzielnego pliku graph.js.

Nadal dostaję ten sam błąd. Które jest naprawione później, kiedy umieszczam tag w następującej kolejności przed końcem tagu, jak pokazano poniżej.

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script> 
<script type="text/javascript" src="jscript/graph.js"></script> 
</body>

Strona wyglądać następująco:

var ctx = document.getElementById("myChart").getContext('2d'); 
 
    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 
 
        } 
 
       }] 
 
      } 
 
     } 
 
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script> 
 
<!DOCTYPE html> 
 

 
<canvas id="myChart"></canvas>

Źródło

2017-07-03 15:33:14

Dziękuję, że to działa! :) –

ReferenceError: Wykres nie jest zdefiniowany - chartjs

Powiązane problemy