Json canvasjs 的数据不起作用

Question

我想使用此代码通过 ajax 获取 json 数据，它可以与原始源代码中的其他 json 数据一起使用，但它不适用于我的json 数据，我错过了什么？请帮忙，谢谢

$(document).ready(function() {
  var dataPointsA = []
  var dataPointsB = []

  $.ajax({
    type: 'GET',
    url: 'https://api.myjson.com/bins/1fp11x',
    dataType: 'json',
    success: function(field) {
      for (var i = 0; i < field.length; i++) {
        dataPointsA.push({
          x: field[i].day,
          y: field[i].impressions
        });
        dataPointsB.push({
          x: field[i].day,
          y: field[i].money
        });
      }


      var chart = new CanvasJS.Chart("chartContainer", {
        title: {
          text: "JSON from External File"
        },

        data: [{
          type: "line",
          name: "line1",
          dataPoints: dataPointsA
        }, {
          type: "line",
          name: "line2",
          dataPoints: dataPointsB
        }, ]
      });

      chart.render();

    }
  });
})

Answer 1

您忘记从 json api 中选择统计字段。此外，还需要为图表设置字段格式。 PS: 图表不好看。您可能需要重新考虑一下。

$(document).ready(function() {
  var dataPointsA = []
  var dataPointsB = []

  $.ajax({
    type: 'GET',
    url: 'https://api.myjson.com/bins/1fp11x',
    dataType: 'json',
    success: function(field) {
    field = field.stats;
      for (var i = 0; i < field.length; i++) {
        
        dataPointsA.push({
          x: new Date(field[i].day),
          y: parseInt(field[i].impressions)
        });
        dataPointsB.push({
          x: new Date(field[i].day),
          y: parseInt(field[i].money)
        });
      }


      var chart = new CanvasJS.Chart("chartContainer", {
        title: {
          text: "JSON from External File"
        },

        data: [{
          type: "line",
          name: "line1",
          dataPoints: dataPointsA
        }, {
          type: "line",
          name: "line2",
          dataPoints: dataPointsB
        }, ]
      });
      
      chart.render();

    }
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 370px; width: 100%;"></div>

Json canvasjs 的数据不起作用

Json data to canvasjs doesn't work

javascript

json

ajax

canvasjs