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>