爲charts.js構建動態數組

我在js中構建數組傳遞到charts.js obj時遇到問題。我有以下數組;爲charts.js構建動態數組

{"Questions":{"name":"Hello World"},"Options":{"inner":{"No":"723","Yes":"6","Maybe":"0"}}}

它被傳遞給下面的函數作爲'響應'。我想遍歷「內部」數組中的每個項目，並構建一個對象數組以傳遞到我的chart.js。

function drawChart(response){ 
    var array = JSON.parse(response) 
    var options = array['Options']['inner']; 

    for(var option in options){ 
     var datasetValue = []; 

     datasetValue.push = { 
      value: parseInt(options[option]), 
      color: "#F7464A", 
      highlight: "#FF5A5E", 
      label: option 
     } 
    } 
    console.log(datasetValue); 
    var mydata = { 
     datasetValue 
    } 

    var pieData = [ 
     { 
      value: 300, 
      color: "#F7464A", 
      highlight: "#FF5A5E", 
      label: "Red" 
     }, 
     { 
      value: 50, 
      color: "#46BFBD", 
      highlight: "#5AD3D1", 
      label: "Green" 
     }, 
     { 
      value: 100, 
      color: "#FDB45C", 
      highlight: "#FFC870", 
      label: "Yellow" 
     }, 
     { 
      value: 40, 
      color: "#949FB1", 
      highlight: "#A8B3C5", 
      label: "Grey" 
     }, 
     { 
      value: 120, 
      color: "#4D5360", 
      highlight: "#616774", 
      label: "Dark Grey" 
     } 
    ]; 
    var ctxOptions = { 
     responsive: true, 
     legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<segments.length; i++){%><li><span style=\"background-color:<%=segments[i].fillColor%>\"></span><%if(segments[i].label){%><%=segments[i].label%><%}%></li><%}%></ul>", 
     showTooltips: false, 
    }; 
    var pie_ctx = document.getElementById("donut").getContext("2d"); 
    var chart = new Chart(pie_ctx).Doughnut(mydata, ctxOptions); 
    }

你可以看到上面我有兩個數組，我試圖建立'datasetValue'和'pieData'的動態數組。 pieData是一個示例，如果我將這個數組傳遞到我的新圖表中，數組工作正常，但我的datasetValue只包含最後一項，而不是所有對象都是pieData。下面是我的console.log（datasetValue）的輸出結果。

[push: Object] 
push 
: 
Object 
color 
: 
"#F7464A" 
highlight 
: 
"#FF5A5E" 
label 
: 
"Maybe" 
value 
: 
0

我在做什麼我在重建我的陣列以匹配pieData數組格式？

來源

2017-06-06 gsusonline

我認爲datasetValue.push = {重寫datasetValue的Array.push功能。嘗試datasetValue.push({追加。

而且，很可能只是最後的值會因爲你重置它在每次迭代中加入datasetValue：

for(var option in options){ 
     var datasetValue = [];

來源

2017-06-06 16:16:44 mgamba

感謝隊友，你是對的，我已經把它放在了裏面。看到我的評論如下 – gsusonline

@gsusonline它看起來像你仍然覆蓋'push'函數。如果您嘗試切換到'datasetValue.push（'而不是'datasetValue.push ='？ – mgamba

）哦，我已經根據您的評論修復了這個問題，我將var datasetValue移到了for循環之外，並將其設置爲.push（{而不是.push = { – gsusonline

你datasetValue只包含最後一個項目，因爲你實例化它在for循環。每次進入for循環時，datasetValue都將被重新創建（設置爲空數組），因此只記錄'last'項目。你應該在for循環之外實例化它。

var datasetValue = []; 
for(var option in options){ 

    datasetValue.push = { 
     value: parseInt(options[option]), 
     color: "#F7464A", 
     highlight: "#FF5A5E", 
     label: option 
    } 
}

來源

2017-06-06 16:19:08 Dino

謝謝，這就糾正了循環，所以我的數組現在有3個對象 - 但是，它仍然不會讓我的圖表繪製 – gsusonline

如果您可以創建一個plunker或jsfiddle演示，那將是非常棒的。 – Dino

當然，我會嘗試創建一個 – gsusonline

爲charts.js構建動態數組

回答

相關問題