GeoLocationActual.html

<html>
	<head>
		<title>Google Map</title>
		<meta name="viewport" content="initial-scale=1.0">
		<meta charset="utf-8">
		<style>		  
		  #map { 
			height: 300px;	
			width: 600px;			
		  }		  
		</style>		
		<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
	</head>	
	<body>		
		<div style="padding:10px">
			<div id="map"></div>
		</div>
		
		<script type="text/javascript">
		var map;
		
		function initMap() {							
			var latitude = 27.7172453; // YOUR LATITUDE VALUE
			var longitude = 85.3239605; // YOUR LONGITUDE VALUE
			
			var myLatLng = {lat: latitude, lng: longitude};
			
			map = new google.maps.Map(document.getElementById('map'), {
			  center: myLatLng,
			  zoom: 14					
			});
					
			var marker = new google.maps.Marker({
			  position: myLatLng,
			  map: map,
			  //title: 'Hello World'
			  
			  // setting latitude & longitude as title of the marker
			  // title is shown when you hover over the marker
			  title: latitude + ', ' + longitude 
			});			
		}
		</script>
		
		<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB3ovdh6Qae5FWPMPpfS5X02JLbqpc2n8U&libraries=places&callback=initMap"
		async defer></script>
	</body>	
</html>