What am I doing wrong? Google chart appears as blank. I'm trying to display a multi dimension line chart using google chart.
I need to display this multi level associative array in googlechart. I'm using PHP. I combined two SQL query to a single json file so that I could display this year and last year data but I can't display it in google chart. The page appears blank.
Here's the URL for the chart,
https://myndsyn.com/lb-admin/sampleHere's a sample JSON file
```
{"data1":[{"num":"1","rdate":"1"},{"num":"1","rdate":"2"},{"num":"1","rdate":"3"},{"num":"1","rdate":"4"},{"num":"1","rdate":"5"},{"num":"1","rdate":"6"},{"num":"2","rdate":"8"},{"num":"1","rdate":"10"},{"num":"1","rdate":"11"},{"num":"5","rdate":"12"}],"data2":[{"num2":"7","rdate2":"11"},{"num2":"8","rdate2":"12"}]}
```
**PHP file**
```
<?php require_once('../../private/initialize.php'); ?>
<?php require_login(); ?>
<?php require_once('../../private/db_config.php'); ?>
<!-- start of the HTML part that Google Chart needs -->
<script src="
https://www.gstatic.com/charts/loader.js"></script>
<?php
$year = idate('Y');
//MONTH Query
//$result = mysqli_query($connection, "SELECT COUNT(id) AS num, MONTH(regdate) as month FROM customers WHERE YEAR(regdate) = $year GROUP BY MONTH(regdate) ");
//Year Query
$result_this_year = mysqli_query($connection, "SELECT COUNT(id) AS num, MONTH(regdate) AS rdate FROM customers WHERE YEAR(regdate) = $year GROUP BY MONTH(regdate)");
$result_last_year = mysqli_query($connection, "SELECT COUNT(id) AS num, MONTH(regdate) AS rdate FROM customers WHERE YEAR(regdate) = $year - 1 GROUP BY MONTH(regdate)");
//loop through the returned data
$data_this_year = array();
foreach ($result_this_year as $row_current) {
$data_this_year[] = $row_current;
}
$data_last_year = array();
foreach ($result_last_year as $row_last) {
$data_last_year[] = $row_last;
}
//free memory associated with result
$result_last_year->close();
$result_this_year->close();
print json_encode(['data1' => $data_this_year, 'data2' => $data_last_year]);?>
<!--Google chart-->
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']}).then(function drawChart() {
var num1 = [];
var rdate1 = [];
var num2 = [];
var rdate2 = [];
var data1 = [];
var data2 =[];
//var data_currentyear = <?php //echo json_encode($data_this_year); ?>//;
//var data_lastyear = <?php //echo json_encode($data_last_year); ?>//;
for(var i in data1) {
num1.push( data1[i].num);
rdate1.push(data1[i].rdate);
}
for(var x in data2) {
num2.push( data2[x].num);
rdate2.push(data2[x].rdate);
}
// Current month
var data1 = new google.visualization.DataTable();
data1.addColumn({label: num1, type: 'number'});
data1.addRows({label: rdate1, type: 'number'});
// Last Month
var data2 = new google.visualization.DataTable();
data1.addColumn({label: num2, type: 'number'});
data2.addRows({label: rdate2, type: 'number'});
// Join data tables
var join1 = google.visualization.data.join(data1, data2, 'full', [[0,0]], [1], [1]);
// Curved line
var options = {
title: '',
curveType: 'function',
legend: { position: 'bottom' }
};
// Curved chart
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(join1, options);
}); // End bracket from drawChart
</script>
<div id="curve_chart" style="width: 1800px; height: 960px;"></div>
```