CanvasJS柱形圖與外部JSON數據不加載

Question

我試着從一個文件

我有什麼我至今一的jsfiddle加載使用JSON格式的外部數據這個柱形圖。 感謝您的幫助。

http://jsfiddle.net/t9n4d8z4/1/

 $(document).ready(function() { 
 
      var dataPoints = []; 
 
      $.getJSON("https://api.myjson.com/bins/1kfs1", function(result) { 
 
      for (var i = 0; i <= result.length - 1; i++) { 
 
       dataPoints.push({ 
 
       label: result[i].label, 
 
       y: parseInt(result[i].y) 
 
       }); 
 
      } 
 
      var chart = new CanvasJS.Chart("chartContainer", { 
 
       data: [{ 
 
       type: "column", 
 
       dataPoints: result 
 
       }] 
 
      }); 
 

 
      chart.render(); 
 
      }); 
 
     });

<script src="https://cdnjs.cloudflare.com/ajax/libs/canvasjs/1.7.0/canvasjs.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 1

JSON格式不妥善處理。

這裏是工作提琴：http://jsfiddle.net/canvasjs/t9n4d8z4/3/

 $(document).ready(function() { 
 
      var dataPoints = []; 
 
      $.getJSON("https://api.myjson.com/bins/1kfs1", function(result) { 
 
      for (var i = 0; i <= result.dataPoints.length - 1; i++) { 
 
       dataPoints.push({ 
 
       label: result.dataPoints[i].label, 
 
       y: parseInt(result.dataPoints[i].y) 
 
       }); 
 
      } 
 

 
      var chart = new CanvasJS.Chart("chartContainer", { 
 
       data: [{ 
 
       type: "column", 
 
       dataPoints: dataPoints 
 
       }] 
 
      }); 
 

 
      chart.render(); 
 
      }); 
 
     });

<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
 
<div id="chartContainer" style="height: 360px; width: 100%;"></div>