wtreston
wtreston

Reputation: 1061

Google Visualization Column Chart error

Im trying to display some data using Google Visualisation's Column Chart.

This is the html/javascript I am using:

<script type="text/javascript">
   google.charts.load('current', {'packages':['bar']});
   google.charts.setOnLoadCallback(drawChart);

   function drawChart() {
     var data = google.visualization.arrayToDataTable([
       ['Rating', 'Form 1', 'Form 2'],
       ['Very Poor', 1000, 400],
       ['Poor', 1170, 460],
       ['Average', 660, 1120],
       ['Good', 1030, 540]
       ['Very Good', 1030, 540]

     ]);

     var options = {
       height: 400,                  
     };

     var chart = new google.charts.Bar(document.getElementById('{{ question.0.name }}'));

     chart.draw(data, options);
   }
</script>

When I go to load the page, I get this error:

jsapi_compiled_default_module.js:85 Uncaught (in promise) Error: Invalid row type for row 3
    at gvjs_Fba (jsapi_compiled_default_module.js:85)
    at Object.gvjs_8m [as arrayToDataTable] (jsapi_compiled_default_module.js:86)
    at drawChart ((index):57)
    at <anonymous>

Which refers to this line (at least I think it does, when I click the error this line turns yellow in the inspect tool):

var data = google.visualization.arrayToDataTable([

Upvotes: 0

Views: 547

Answers (1)

wtreston
wtreston

Reputation: 1061

I forgot a comma in the list

 var data = google.visualization.arrayToDataTable([
   ['Rating', 'Form 1', 'Form 2'],
   ['Very Poor', 1000, 400],
   ['Poor', 1170, 460],
   ['Average', 660, 1120],
   ['Good', 1030, 540], <----- NEEDED THIS
   ['Very Good', 1030, 540]

 ]);

Upvotes: 0

Related Questions