無法讀取未定義的屬性'Concat'

我正在嘗試使用charts.js插件並執行組合圖表，但我希望該行位於該欄的頂部。這是我使用的語法，和我的兩個陣列linedata & bardata被填充，但每當我跑這句法，我得到的無法讀取未定義的屬性'Concat'

Uncaught TypeError: Cannot read property 'concat' of undefined
at n (Chart.min.js:11)
at t.update (Chart.min.js:11)
at t.construct (Chart.min.js:11)
at new t (Chart.min.js:12)
at trends:507

此錯誤是語法我utulize - 哪裏是錯誤？

var ctx = document.getElementById('canvas').getContext('2d'); 
var chart = new Chart(ctx, { 
    data: { 
     labels: labelsarr, 
     datasets: [{ 
       type: 'line', 
       fill: false, 
       label: 'Line Example', 
       backgroundColor: 'rgba(255,0,0,1)', 
       borderColor: 'rgba(255,0,0,1)', 
       data: linedata 

      }, { 
       type: 'bar', 
       label: 'Bar Example', 
       backgroundColor: 'rgba(0, 129, 214, 0.8)', 
       data: bardata 
      }] 
    }, 
    options: { 
     tooltips: { 
      callbacks: { 
       label: function (t, d) { 
        var xLabel = d.datasets[t.datasetIndex].label; 
        var yLabel = t.yLabel >= 1000 ? '$' + t.yLabel.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") : '$' + t.yLabel; 
        return xLabel + ': ' + yLabel; 
       } 
      } 
     }, 
     legend: { 
      display: false, 
      position: 'top', 
     }, 
     scales: { 
      yAxes: [{ 
        ticks: { 
         beginAtZero: true, 
         callback: function (value, index, values) { 
          if (parseInt(value) >= 1000) { 
           return '$' + value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); 
          } else { 
           return '$' + value; 
          } 
         } 
        } 
       }] 
     } 
    }, 
    plugins: [{ 
       beforeDraw: function(chart) { 
        var labels = chart.data.labels; 
       } 
     }] 
});

編輯
這是如何被填充的陣列 - 從PHP

 var ldata = <?php echo $ldata; ?>; 
     var values = []; 
     for (var i = 0; i < ldata.length; i++) { 
      values.push(ldata[i]); 
     } 
     var bdata = <?php echo $bdata; ?>; 
     var values1 = []; 
     for (var i = 0; i < bdata.length; i++) { 
      values1.push(bdata[i]); 
     }

來源

2017-07-27 Smith Stanley

你怎麼知道你供應數組不是'undefined'？ – Pointy

至少可以讓我們知道錯誤的起源線嗎？ – Kaddath

@Pointy - 如果我做了一個alert（linedata.length）; ＆alert（bardata.length）;他們都返回24. –

傳遞的值，您必須設置圖表type在主圖表選項，不裏面的dataset（第二個）：

var chart = new Chart(ctx, { 
    type: 'bar', 
    data: { 
     ...

這裏是你的代碼的工作版本：

var labelsarr = ['A', 'B', 'C']; 
 
var linedata = [2, 5, 3]; 
 
var bardata = [4, 2, 6]; 
 

 
var ctx = document.getElementById('canvas').getContext('2d'); 
 
var chart = new Chart(ctx, { 
 
    type: 'bar', //<-- set here 
 
    data: { 
 
     labels: labelsarr, 
 
     datasets: [{ 
 
     type: 'line', 
 
     fill: false, 
 
     label: 'Line Example', 
 
     backgroundColor: 'rgba(255,0,0,1)', 
 
     borderColor: 'rgba(255,0,0,1)', 
 
     data: linedata 
 

 
     }, { 
 
     label: 'Bar Example', 
 
     backgroundColor: 'rgba(0, 129, 214, 0.8)', 
 
     data: bardata 
 
     }] 
 
    }, 
 
    options: { 
 
     tooltips: { 
 
     callbacks: { 
 
      label: function(t, d) { 
 
       var xLabel = d.datasets[t.datasetIndex].label; 
 
       var yLabel = t.yLabel >= 1000 ? '$' + t.yLabel.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") : '$' + t.yLabel; 
 
       return xLabel + ': ' + yLabel; 
 
      } 
 
     } 
 
     }, 
 
     legend: { 
 
     display: false, 
 
     position: 'top', 
 
     }, 
 
     scales: { 
 
     yAxes: [{ 
 
      ticks: { 
 
       beginAtZero: true, 
 
       callback: function(value, index, values) { 
 
        if (parseInt(value) >= 1000) { 
 
        return '$' + value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); 
 
        } else { 
 
        return '$' + value; 
 
        } 
 
       } 
 
      } 
 
     }] 
 
     } 
 
    }, 
 
    plugins: [{ 
 
     beforeDraw: function(chart) { 
 
     var labels = chart.data.labels; 
 
     } 
 
    }] 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"></script> 
 
<canvas id="canvas"></canvas>

來源

2017-07-27 13:50:44

無法讀取未定義的屬性'Concat'

回答

相關問題