如何在javascript中动态创建对象数组以获得饼图

时间:2015-08-31 06:57:28

标签: javascript charts chart.js

我正在为饼图创建动态值,饼图是chart.js中的图形 我创建了一个包含多个对象值的变量,需要在饼图的数组中传递。 如果我传递变量没有显示,但如果我将相同的静态值传递给变量,则饼图开始工作。 我搜索了各种方法但无法使用我的代码。 我的代码如下所示:

  /*PIE Chart*/
    var elements = [];
    var counter;
    jQuery.ajax({
    type: 'POST',
    url: 'ajax-request.php',
  data: {},
  success: function(response){
    //here data is means the out put from the php file it is not           
     $('#StudentID').val()
    var jsonData = JSON.parse(response);
        console.log(elements); 
        var pieData;
        for (var i = 0; i < jsonData.length; i++) {
            counter = jsonData[i];
            var sale = roundFloat(counter.sales,2);
            elements+= '{value:'+sale+',color: "#FDB45C",highlight: "#FFC870",label:"'+counter.sku+'"},';

        }
        var pieData = [elements];

    var ctx = document.getElementById("pie-chartjs").getContext("2d");
    window.myPie = new Chart(ctx).Pie(pieData);
   } 
   });

1 个答案:

答案 0 :(得分:1)

您需要对代码进行一些更改才能使其正常工作。

pieData应该是一个对象数组。因此,您需要将push对象放入数组中,而不是附加字符串。完成后elements是一个对象数组,您可以直接将其分配给pieData

以下是更改的代码块

for (var i = 0; i < jsonData.length; i++) {
    counter = jsonData[i];
    var sale = roundFloat(counter.sales, 2);
    elements.push({
        value: sale,
        color: "#FDB45C",
        highlight: "#FFC870",
        label: counter.sku
    })
}
var pieData = elements;