Getting "Cannot read property 'datefield' of undefined" when trying to draw google chart using mysql table and PHP

Question

I tried creating google chart with values retrieved from database table using PHP , my database gets connected but am getting an error like "Cannot read property 'datefield' of undefined"

my database table contain two columns 'Row Labels (VARCHAR)', 'Sum of No in Rows (INT)' . I don't understand why am getting that error .

<?php
$connection = mysqli_connect('localhost', 'root', '', 'testingoforiginal');
$result = mysqli_query($connection, "SELECT * FROM ba");
if($result){
   echo "CONNECTED";
}
?>
<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['bar']});
      google.charts.setOnLoadCallback(drawStuff);

      function drawStuff() {
        var data = new google.visualization.arrayToDataTable([
          ['Row Labels', 'Sum of No in Rows'],
          <?php
              if(mysqli_num_rows($result) > 0 ){
                  while($row = mysqli_fetch_array($result)){
                      echo"['".$row['Row Labels']."',[".$row['Sum of No in Rows']."]],";

                  }
              }
          ?>
        ]);

        var options = {
          title: 'BA',
          width: 900,
          legend: { position: 'none' },
          chart: { title: 'BA',
                   subtitle: ' ' },
          bars: 'horizontal', // Required for Material Bar Charts.
          axes: {
            x: {
              0: { side: 'top', label: 'Sum of No in Rows'} // Top x-axis.
            }
          },
          bar: { groupWidth: "90%" }
        };

        var chart = new google.charts.Bar(document.getElementById('top_x_div'));
        chart.draw(data, options);
      };
    </script>
  </head>
  <body>
    <div id="top_x_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

no @Dharman , i tried that too but it doesn't work , so i just referred some of the videos and did this — sreesha sudhev, Sep 21 '20 at 12:27
Have you seen all the related posts on the right side. Check if any of them can provide you with a solution. — Dharman, Sep 21 '20 at 12:31

WhiteHat · Accepted Answer · 2020-09-21T13:19:01.960

0

try removing the extra brackets in the second row value...

change...

echo"['".$row['Row Labels']."',[".$row['Sum of No in Rows']."]],";

to...

echo"['".$row['Row Labels']."',".$row['Sum of No in Rows']."],";

EDIT

recommend using json_encode to pass json data from php.

build your array in php...

<?php
  $connection = mysqli_connect('localhost', 'root', '', 'testingoforiginal');
  $result = mysqli_query($connection, "SELECT * FROM ba");
  if($result){
    echo "CONNECTED";
  }

  $data = array();
  $data[] = ['Row Labels', 'Sum of No in Rows'];
  if(mysqli_num_rows($result) > 0 ){
    while($row = mysqli_fetch_array($result)) {
      $data[] = [$row['Row Labels'], $row['Sum of No in Rows']];
    }
  }
?>

then encode it on the page to create the data table...

var data = new google.visualization.arrayToDataTable(<?php echo json_encode($data, JSON_NUMERIC_CHECK); ?>);

edited Sep 21 '20 at 13:19

answered Sep 21 '20 at 12:34

WhiteHat

59,912
7
51
133

i acted silly , i would have checked that . Thank you so much – sreesha sudhev Sep 21 '20 at 12:37
How is that better than what I suggested? If OP had used `json_encode` as they should instead of manually preparing the data then they would likely avoid this problem, no? – Dharman Sep 21 '20 at 12:38
wouldn't say it is better, just quickest way to a solution. I would always recommend using `json_encode` and `$.ajax` to get the data. but most of the time, those recommendations are not heeded... – WhiteHat Sep 21 '20 at 12:53
Maybe it is because people on Stack Overflow show the quick an dirty way instead of showing how to do it properly... – Dharman Sep 21 '20 at 13:06
at least they got it working, I was really just curious if the extra brackets were the problem. @sreesha see __EDIT__ above... – WhiteHat Sep 21 '20 at 13:20
yeah but it changed the position of my axis labels and my x axis points is not visible now @WhiteHat – sreesha sudhev Sep 22 '20 at 05:47
looks like you'll need to ask another question for that issue, this one has been closed... – WhiteHat Sep 22 '20 at 11:04

Getting "Cannot read property 'datefield' of undefined" when trying to draw google chart using mysql table and PHP

1 Answers1