Konstruieren Sie ein Balkendiagramm mit chart.js

-1

Ich wollte ein Balkendiagramm mit chart.js erstellen. Ich tippte diesen Code:Konstruieren Sie ein Balkendiagramm mit chart.js

<!DOCTYPE html> 
<html> 
<head> 
    <title>Bar chart</title> 
    <script src="Chart.js"></script> 
</head> 
<body> 
    <canvas id="canvas" width="256" height="256"></canvas> 
    <script> 
     var my = new Chart(chr).Bar(data); 
     var chr = document.getElementById("canvas"); 
     var ctx = canvas.getContext("2d"); 
     var data = { 
      dataset: [ 
       { 
        label: "my first dataset", 
        fillColor: "blue", 
        strokeColor: "green", 
        data: [65, 53, 80, 83, 55, 45] 
       } 
      ] 
     }; 
     var myfirstChart = new Chart(chr).Bar(data); 
    </script> 
    console.log(ctx); 
</body> 

</html>

... und es sagt, es gibt nicht "Eigenschaft Länge undefiniert lesen".

Was ist der Fehler und wie man es korrigiert?

Quelle

2017-06-09 Aishwarya

Hallo @Aishwarya, habe ich versucht, durch das Formatieren der Code zu retten. Ich habe ursprüngliche Probleme wie 'console.log (ctx)' außerhalb der ' \t \t – Aishwarya

diesen Code Versuchen: Html:

<canvas id="canvas" width="256" height="256"></canvas>

Js:

var chr = document.getElementById("canvas"); 
    var ctx = canvas.getContext("2d"); 
    var data = { 
     type: "bar", 
     data: { 
     labels: ["One", "Two"], 
     datasets: [{ 
      label: "my first dataset", 
      backgroundColor: ["#F7464A", "#46BFBD", "#FDB45C"], 
      fillColor: "blue", 
      strokeColor: "green", 
      data: [65, 53] 
     }] 
     } 
    }; 
    var myfirstChart = new Chart(ctx, data);

Quelle

2017-06-09 10:20:23

nein, es entweder nicht funktioniert diese Art und Weise ist. Ich tippte 2 Dateien html fils mit nur Leinwand und js-Datei mit der Js-Code ... es sagt $ ist nicht definiert.:/ – Aishwarya

@aishwarya hinzufügen jQuery Verweis zu beheben $ nicht definiert Problem –

Joseph i folgend eine gewisse Korrektur in Skript gemacht haben. Es funktioniert gut.

<script> 
 
     var chr = document.getElementById("canvas");  
 
     var ctx = chr.getContext("2d");  \t 
 
\t  ctx.canvas.width = 800; 
 
\t  var data = { 
 
     type: "bar", 
 
     data: { 
 
     labels: ["One", "Two"], 
 
     datasets: [{ 
 
      label: "my first dataset", 
 
      backgroundColor: ["#F7464A", "#46BFBD", "#FDB45C"], 
 
      fillColor: "blue", 
 
      strokeColor: "green", 
 
      data: [65, 53] 
 
     }] 
 
     } 
 
    }; 
 
      
 
     
 
    var myfirstChart = new Chart(chr , data); 
 
    </script>

Quelle

2017-06-09 11:08:21

BTW mein Code funktioniert gut. –

Konstruieren Sie ein Balkendiagramm mit chart.js

Antwort

Verwandte Themen