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', 'Manager');
data.addColumn('string', 'ToolTip');
// For each orgchart box, provide the name, manager, and tooltip to show.
data.addRows([
[{v:'SAID', f:'SAID<div style="color:red; font-style:italic">President</div>'},
'', 'The President'],
[{v:'ANAS', f:'ANAS<div style="color:red; font-style:italic">Vice President</div>'},
'SAID', 'VP'],
['ADIL', 'SAID', ''],
['BADR', 'ANAS', 'BADR Sponge'],
['FOUAD', 'BADR', '']
]);
// Create the chart.
var chart = new google.visualization.OrgChart(document.getElementById('chart_div'));
// Draw the chart, setting the allowHtml option to true for the tooltips.
chart.draw(data, {allowHtml:true});
}