用javascript重新组装json数据

时间:2018-06-01 21:09:37

标签: javascript php json chart.js

好的,所以我设法从php文件发送编码的JSON数据,然后我用javascript解码它,以便用chart.js显示它

JSON数据:

[
    {
        "month_data":"November",
        "year_data":"2016",
        "association":"Caritas",
        "donations":"3"
    },
    {
        "month_data":"November",
        "year_data":"2016",
        "association":"Alihuen",
        "donations":"1"
    },
    {
        "month_data":"November",
        "year_data":"2016",
        "asociacionn":"Caritas",
        "donations":"5"
    },{
        "month_data":"December",
        "year_data":"2016",
        "association":"Caritas",
        "donations":"4"
    },
    {
        "month_data":"December",
        "year_data":"2016",
        "association":"Alihuen",
        "donations":"5"
    },
    {
        "month_data":"December",
        "year_data":"2016",
        "asociacionn":"Caritas",
        "donations":"2"
    }
]

我的目标是在图表中显示这样的内容:

Chart describing each associations' donations month by month

那么我怎样才能重新组装JSON数据以便能够将多个数据集发送到图表?

这就是我设法显示其他要求的数据

$.ajax({
  url: "myurl/data.php",
  method: "GET",
  success: function(monthly_data_detail) {
    console.log(monthly_data_detail);

    var association= [];
    var year_data = [];
    var mes_data = [];
    var donaciones = [];
    var date_data = [];
    var key_data = [];

    for(var i in monthly_data_detail) {
      year_data.push(monthly_data_detail[i].year_data);
      month_data.push(monthly_data_detail[i].month_data);
      association.push(monthly_data_detail[i].association);
      donations.push(monthly_data_detail[i].donations);
    }

    var chartdata = {
      labels: month_data,
      datasets : [
        {
          label: "Donations",
          backgroundColor: 'rgb(255, 99, 132)',
          borderColor: 'rgba(200, 200, 200, 0.75)',
          hoverBackgroundColor: 'rgba(200, 200, 200, 1)',
          hoverBorderColor: 'rgba(200, 200, 200, 1)',
          data: donations
        }
      ]
    };



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

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

0 个答案:

没有答案