ChartJS動態使用jQuery數組添加數值

我正嘗試使用來自jQuery/AJAX查詢的數據動態地填充ChartJS中的餅圖。ChartJS動態使用jQuery數組添加數值

我唯一需要努力的是以chartJS理解的格式創建數據。這是需要的格式：

var dynamicData = [ 
    { label: "One", value: 23 }, 
    { label: "Two", value: 33 }, 
    { label: "Three", value: 43 }, 
    { label: "Four", value: 53 }, 
]

當我嘗試創建它，我獲得雙引號""周圍每一組數據。我知道這是一個簡單的錯誤，但我無法弄清楚。這是我正在創建的數據（部分jQuery代碼）：

.success(function(response) { 
    if(!response.errors && response.result) { 
     var doughnutData = []; 
     $.each(response.result, function(index, value) { 
      doughnutData.push('{ label: "'+value[0]+'", value: '+value[2]+',color:"#F7464A" }'); 
     }); 

     console.log(doughnutData); 

var doughnutOptions = { 
    segmentShowStroke : true, 
    segmentStrokeColor : "#fff", 
    segmentStrokeWidth : 2, 
    percentageInnerCutout : 50, 
    animation : true, 
    animationSteps : 100, 
    animationEasing : "easeOutBounce", 
    animateRotate : true, 
    animateScale : true, 
    onAnimationComplete : null 
} 
var ctx = document.getElementById("chart3").getContext("2d"); 
var mydoughnutChart = new Chart(ctx).Doughnut(dynamicData, doughnutOptions); 
    } else { 
    alert("error"); 
    }

控制檯顯示：

["{ label: "17x1p14e6662", value: 16,color:"#F7464A" }", "{ label: "8734hjgfd784ew", value: 8,color:"#F7464A" }"]

我在做什麼錯？

來源

2017-04-13 Bruno

的控制檯輸出對象作爲一個字符串，因爲你是推一個字符串VAR doughnutData，你這樣做是包裝在引號中的對象和連接的值的字符串爲此處理傳遞給推的說法方法作爲字符串類型。

使用push方法向數組中添加對象的正確方法就是這樣。

array.push({property:'string', property:2})

意味着你的代碼應該看起來像這樣。

doughnutData.push({ label:value[0], value:value[2],color:"#F7464A" });

Here是上推式方法是如何工作的陣列和Here是另一個鏈接到JavaScript對象

當你創建你正在過VAR dynamicData不是圖表的另一件事是一個鏈接你的var doughnutData。

來源

2017-04-13 08:49:52

太棒了！我現在明白這個問題。感謝您花時間回答:) – Bruno

ChartJS動態使用jQuery數組添加數值

回答

相關問題