score:3

i messed around with it and got it working (at least for me)

the notable parts i changed were the ajax:

$.ajax({url:"data.json",datatype:"json"})
  .fail(function(){alert("im a failure")})
  .done(function(data){
  var mydata = (data);

and i took the end part out of the "window.onload", which wasn't neccesary since you'd already declared the canvas.

i guess i'll dump all the code i used

<script src="chart.js"></script>
<script src="jquery-1.11.2.min.js"></script>
</head>
<body>
<div id="chartcanvas">
 <canvas id="canvas"></canvas>
 <br>
</div>


<script type="text/javascript">
$.ajax({url:"data.json",datatype:"json"})
  .fail(function(){alert("im a failure")})
  .done(function(data){
  var mydata = (data);
  console.log(mydata[0].jaar);
array.prototype.mapproperty = function(property) {
      return this.map(function (obj) {
       return obj[property];
      });

     };

// example: mydata.mapproperty('rank') to get an array of all ranks 
 linechartdata = {
    labels : mydata.mapproperty('jaar'),
     datasets : [
       {
   label: "my first dataset",
   fillcolor : "rgba(220,220,220,0.2)",
   strokecolor : "rgba(220,220,220,1)",
   pointcolor : "rgba(220,220,220,1)",
   pointstrokecolor : "#fff",
   pointhighlightfill : "#fff",
   pointhighlightstroke : "rgba(220,220,220,1)",
   data : mydata.mapproperty('verbruikingb')
  }
       ]
  };

 //window.onload = function(){
console.log("cheerio")
 var ctx = document.getelementbyid("canvas").getcontext("2d");
 window.myline = new chart(ctx).line(linechartdata);
 //}  

});


Related Query

More Query from same tag