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});
}
Background div gradient

Background div gradient

Bootstrap4 datepicker

Bootstrap4 datepicker

Double Scrollbar style in table 01

Double Scrollbar style in table 01

Nav Menu style01

Nav Menu style01

Page construction avec compte à rebours style02

Page construction avec compte à rebours style02

Pure CSS Percentage Circle

Pure CSS Percentage Circle

SwiperJS style01

SwiperJS style01

Timeline style01

Timeline style01

Timeline style03

Timeline style03

Timeline style08

Timeline style08

Titre section avec une anmation style01

Titre section avec une anmation style01

Vidéo background en html5 style02

Vidéo background en html5 style02