2016-07-29 9 views
0

chart.jsを使用して円グラフをテストしようとしています。私は '長さ'のプロパティとchart.jsファイルで '初期化'のプロパティを読み取ることができません。私はすべてのオプションを試して、どこに問題があるのか​​わかりません。 jsfiddlechart js pie chart:chart.jsにエラーがありますか?

コード

https://jsfiddle.net/n8ox2fqb/1/

enter image description here

ファイルのコードを以下ましたpieChart.js。私の頭の上オフ

var pieData = [ 
    { 
     value: '25', 
     label: 'Java', 
     color: '#811BD6' 
    }, 
    { 
     value: '10', 
     label: 'Scala', 
     color: '#9CBABA' 
    }, 
    { 
     value: '30', 
     label: 'PHP', 
     color: '#D18177' 
    }, 
    { 
     value : '35', 
     label: 'HTML', 
     color: '#6AE128' 
    } 
] 



var pieOptions = {}; 

$(document).ready(function() { 

    var ctxt = document.getElementById('myChart'); 
    var myPieChart = new Chart(ctxt,{ 
     type: 'pie', 
     data: pieData, 
     options: pieOptions 
    }); 

}); 

HTMLコード

<html lang="en"> 
    <head> 
     <script src="src/jquery.min.js"></script> 
     <script src="src/Chart.js"></script> 
    </head> 
      <Title> 
       Test Pie Chart 
      </Title> 
    <body> 
     <div> 
      <div> 
       <canvas id="myChart" width="400" height="400"></canvas> 
      </div> 
     </div> 
     <script src="pieChart.js"></script> 
    </body> 
</html> 
+3

フィドルにはいくつかの参考文献がありません – Ju66ernaut

+0

どのような情報がありますか、私をガイドしてください。 – SKay

+1

jqueryとchart.jsは追加されません。しかし、私はあなたがchart.jsで作業するキャンバスの2次元コンテキストを必要とすると思います。 – Ju66ernaut

答えて

1

私は私には1つの明白な問題があると言うつもりです、それはあなたが

をしたいライン

var ctxt = document.getElementById('myChart'); 

です

var ctxt = document.getElementById('myChart').getContext('2d'); 

また、チャートd間違った形式のata。チャート設定オブジェクトの 'data'プロパティには、オブジェクトの配列である 'datasets'というプロパティがあります。 Check out their docs here

+0

私もそれを試しました! – SKay

関連する問題