Chart.JS Can not read property '_meta' of Undefined
Asked Answered
G

1

6

I am attempting to build a basic bar chart, but I am getting the error in the title. I have used alert() to verify that the array I want to populate the chart with holds data, but something is still not fishing out properly with the syntax. Can someone examine and let me know what I need to do better in order to make the chart produce?

    var ctx = document.getElementById('cvtree').getContext('2d');
var chart = new Chart(ctx, {
    type: 'bar',
    data: { 
        labels: yoylabels,
        datasets: [{
                label: 'Pay By Person',
                backgroundColor: 'rgba(0, 129, 214, 0.8)',
                data: numericdollarvals
            }]
    },
    options: {
        },
        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;
                            }
                        }
                    }
                }]
        }
});
Griz answered 3/8, 2017 at 2:32 Comment(0)
B
5

You are unexpectedly closing off the options property, before setting all the options.

Here is the correct syntax :

var ctx = document.getElementById('cvtree').getContext('2d');
var chart = new Chart(ctx, {
   type: 'bar',
   data: {
      labels: yoylabels,
      datasets: [{
         label: 'Pay By Person',
         backgroundColor: 'rgba(0, 129, 214, 0.8)',
         data: numericdollarvals
      }]
   },
   options: {
      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;
                  }
               }
            }
         }]
      }
   }
});
Benjy answered 3/8, 2017 at 2:50 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.