2017-10-06 179 views
2

我想繪製一個條形圖chart.js使用多個標籤,以便我可以操縱它們。我已經設法用折線圖來做,並試圖擴展我在那裏沒有運氣的事情。我收到這個錯誤。什麼可能導致它?Chart.js - 繪製多條標籤條形圖

"Uncaught TypeError: Object.defineProperty called on non-object".

的問題是在某處的數據:{},因爲當我有數據作爲一個簡單的指數爲2陣列它是工作的罰款。

編輯:當通過數據集時=空;

 var com_passed = rows[rows.length-2]["# Common Passed"]; 
     var com_failed = rows[rows.length-2]["# Common Failed"]; 
     var ctx = document.getElementById("common_chart"); 
     ctx.height = 50; 

     var historicalChart = new Chart(ctx, { 
      type: 'bar', 
      data: { 
       labels: ["Passed", "Failed"], 
       datasets: [ 
       { 
        data: com_passed, 
        label: "Passed", 
        fillColor: "red" 
       }, 
       { 
        data: com_failed, 
        label: "Failed", 
        fillColor: "green"      
       } 
        ] 
      }, 
       options: { 
        scales: { 
         yAxes: [{ 
          ticks: { 
          beginAtZero:true, 
          responsive: false, 
          maintainAspectRatio: true 
          } 
         }] 
        } 
       } 
     }); 
+0

您是否試過單步執行代碼?那麼你可能可以把它縮小得比「數據中的某個地方」更近。 – jdv

+0

我剛穿過代碼,它顯示數據集爲空。我很難找出原因。 – sf8193

+0

這是應該在問題的主體中的那種細節。 – jdv

回答

1

對於那些有類似問題的人。我需要將數據com_passed和com_failed作爲一個數組而不是像這樣的整數。

var com_passed = rows[rows.length-2]["# Common Passed"]; 
    var com_failed = rows[rows.length-2]["# Common Failed"]; 
    var ctx = document.getElementById("common_chart"); 
    ctx.height = 50; 

    var historicalChart = new Chart(ctx, { 
     type: 'bar', 
     data: { 
      labels: ["Passed", "Failed"], 
      datasets: [ 
      { 
       data: [com_passed], 
       label: "Passed", 
       fillColor: "red" 
      }, 
      { 
       data: [com_failed], 
       label: "Failed", 
       fillColor: "green"      
      } 
       ] 
     }, 
      options: { 
       scales: { 
        yAxes: [{ 
         ticks: { 
         beginAtZero:true, 
         responsive: false, 
         maintainAspectRatio: true 
         } 
        }] 
       } 
      } 
    });