2016-12-01 2 views
0

Ich bekomme diesen Fehler und ich konnte noch kein Chart.js Diagramm anzeigen, obwohl ich mehrere Codes ausprobiert habe, die ich im Internet gefunden habe.Fehler mit Chart.js: TypeError: t ist undefined

Hier ist der relevante Teil des 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> 

hier das Javascript ist:

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 
       } 
      }] 
     } 
    } 
}); 

ich dieses Beispiel hier: http://www.chartjs.org/docs/

Und ich diesen Fehler in der Konsole:

TypeError: t is undefined 

Kann mir bitte jemand helfen? Vielen Dank.

+1

Der von Ihnen gepostete Code ist in Ordnung: https://jsfiddle.net/bd6Lf88a/ Das Problem muss woanders liegen. Vergiss das; Sie müssen die neueste Version einschließen: 'https: // cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.bundle.js' –

+0

Ja, dachte gerade, dass im Moment. Offensichtlich gibt es viele Versionen auf diesem CDN, die nicht funktionieren. Dieser https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.2.0/Chart.min.js funktioniert anscheinend auch. Vielen Dank. –

Antwort

0

Setzen Sie den Javascript-Code (beginnend mit <script type="text/javascript">var ctx ...</script>) nach dem Element canvas. Dies stellt sicher, dass das Canvas-Element bereits zu dem Zeitpunkt vorhanden ist, wenn es von var ctx = document.getElementById("myChart");

referenziert wird Dies sollte Ihr Problem lösen.

Verwandte Themen