title: Chart.js data array using PHP, MySQL. How to define datasource from JSON array?
body: <p>This is my first question. Kindly apologize for any errors.</p>
  
  <p>I am trying to draw a chart using chart.js with PHP and MySQL data. The graph I intend to draw is a simple vertical barchart, birth_year vs number of people born. When I display the arrays $BIRTH_YEAR and $COUNTS, I could see the values. I was able to get to the point till json_encode($data_array). When I try to use this encoded array on javascript, I do not get any output, a blank page! Here is my code.</p>
  
  <pre><code>while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
  $data[] = array(
      $row['BIRTH_YEAR']=&gt;$row['counts'],
  );
  $BIRTH_YEAR[]=$row['BIRTH_YEAR'];
  $COUNTS[]=$row['counts'];
  }
  
  // JSON arrays for labels and counts
  $js_labels = json_encode($BIRTH_YEAR,true);
  $js_cols = json_encode($COUNTS,true);
  
  
  var barChartData = {
          labels : '&lt;?php echo $js_labels; ?&gt;',
                      datasets : [
              {
                  fillColor : "rgba(220,220,220,0.5)",
                  strokeColor : "rgba(220,220,220,1)",
                  data : '&lt;?php echo $js_cols; ?&gt;'
              }
  
          ]
                     }
  
  var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Bar(barChartData);
  </code></pre>
  
  <p>I have included all other required HTML elements in my page. When I use the chart.js sample file I was able to see charts. The only issue is I am not sure how to include arrays in javascript data: part. Thanks in advance. </p>