谷歌组织结构图:无法显示组织结构图

Here is my database snap: link
Here is my code:

<?php
 $db=mysqli_connect("localhost","root","","organisation"); //db connection
 $query=mysqli_query($db, "SELECT name,below_whom FROM org"); //fetch data
 if($query){
 $data=[];
 while($org_data=mysqli_fetch_assoc($query)){
 $data []= [$org_data["name"],$org_data["below_whom"]]; //syntax of 
 associative array = $variable["value"]
 }
 #echo '<pre>'; print_r($data); echo '</pre>';
 }
 else {
 "Error".mysqli_error();
}
?>
<html>
<head></head>
<body>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {packages:["orgchart"]});
google.charts.setOnLoadCallback(drawChart);

function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'name');
data.addColumn('string', 'below_whom');
data.addColumn('string', 'ToolTip');
data.addRows(<?php echo json_encode($data); ?>);
var chart = new google.visualization.OrgChart(document.getElementById('chart_div')); 
chart.draw(data, {allowHtml:true});
}
</script>
<div id="chart_div"></div> 
</body>
</html>

I have been going through the documentation for quite sometime now and I am still clueless. I guess error is somewhere near addRows but I'm unable to trace it.

It seems to me that there is no issue with your code, however the issue is in your data. Your queried data will be like this:

|name   |below_whom|
|-------|----------|
|Pratik |          |
|-------|----------|
|Q      |FTA       |
|-------|----------|

So you see, the "Q" has "FTA" as the boss, but google organization chart could not find "FTA". If you change "FTA" to "Pratik", you will see magic happens.