Organization Chart

<!DOCTYPE html>
<html>
<head>
	<title>Organization Chart | Par NGLESSON</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="keyword" content="Organization Chart">
	<meta name="author" content="Mezgani said">
	<meta name="copyright" content="NGLESSON">
	<meta name="robots" content="index,follow">
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" type="text/css">
</head>
<body class="container">
<div class="row">	
	<div class="col-lg-12 mt-5">
		<div id="chart_div"></div>
	</div>	
</div>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="script.js"></script>
</body>
</html>

                                    
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});
}
Asidebar Bootstrap4 style02

Asidebar Bootstrap4 style02

Background overlay

Background overlay

Card Bootstrap4 E commerce 01

Card Bootstrap4 E commerce 01

Carousel Bootstrap3

Carousel Bootstrap3

Elastic Content Slider

Elastic Content Slider

Login Bootstrap3

Login Bootstrap3

Page 404 exemple 01

Page 404 exemple 01

Pagination with Jquery

Pagination with Jquery

Scroll down button 01

Scroll down button 01

Social Media Icons

Social Media Icons

Timeline style01

Timeline style01

Titre section avec une anmation style01

Titre section avec une anmation style01