从data.php获取数据并传输到条形图中

时间:2018-10-22 16:41:39

标签: javascript chartjs-2.6.0

data.php,其中数据以JSON形式

我的可视化bargraph.html所有主视图在该图上都看不到日期

我的app.js从data.php获取数据并传输到条形图中,但是日期没有插入到条形图中-我在做什么错了?

$(document).ready(function() {
  $.ajax({
    url: "http://localhost/chartjs/data.php",
    method: "GET",
    success: function(data) {
      console.log(data);
      var incubator = [];
      var total = [];
      var calender = [];

      for (var i in data) {
        incubator.push("incubator " + data[i].incubatorid);
        calender.push("calender " + data[i].calender);
        total.push(data[i].total);

      }

      var chartdata = {
        labels: incubator,
        datasets: [{
          label: 'Total successfull egg hatch hahhaha ',
          backgroundColor: 'rgba(200, 200, 200, 0.75)',
          borderColor: 'rgba(200, 200, 200, 0.75)',
          hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
          hoverBorderColor: 'rgba(200, 200, 200, 1)',
          data: total
        }]
      };


      var ctx = $("#mycanvas");

      var barGraph = new Chart(ctx, {
        type: 'bar',
        data: chartdata
      });
    },
    error: function(data) {
      console.log(data);
    }
  });
});

1 个答案:

答案 0 :(得分:0)

您要执行库不允许的操作,图表类型 bar 仅接受labelxAxisIDyAxisID来在它,其他属性仅用于设计图表样式。

您可以查看此图表here的更多详细信息: