[Chartjs]-Google charts: Error: Row 0 has 1 columns, but must have 2

1👍

One of your variables is not set, either $popularBooks["book_name"] or $popularBooks["total_amount"].

I hard coded both values into an array, and rendering works fine.
See the code segment below:

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load("current", {packages:["corechart"]});                              
google.charts.setOnLoadCallback(drawChart);

function drawChart() {
  var data = google.visualization.arrayToDataTable([
      ['Book', 'Amount'],
  <?php
    $popularBooks = array(
      'book_name' => 'Test',
      'total_amount'  => 2
    );
    echo "['".$popularBooks["book_name"]."', ".$popularBooks["total_amount"]."],";
  ?>
]);

var options = {
 pieHole: 0.4,
};

var chart = new google.visualization.PieChart(document.getElementById('donutchart'));
      chart.draw(data, options);
    }
</script>

<div id="donutchart">
</div>

Whereas omitting either value from the array declaration, results in the error you’ve described:

jsapi_compiled_default_module.js:85 Uncaught (in promise) Error: Row 0 has 1 columns, but must have 2
at gvjs_Fba (jsapi_compiled_default_module.js:85)
at Object.gvjs_8m [as arrayToDataTable] (jsapi_compiled_default_module.js:86)
at drawChart (graph2.php:7)

Leave a comment