Web Tutorials

Interview Q & A

Code Examples

Utility Tools

Set HYBRID MaptypeId in Google Maps

In this example you will learn how to set HYBRID maptypeId in google map api by using google maps API javascript library.

Here you can view the output of the example and you can also "try it yourself" by clicking on "Live Demo" button given at the bottom.

Syntax

//Set map center lat/lng
  var lat_lng = {lat: 20.08672, lng: 78.42444};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 6,
    center: lat_lng, // map center
    mapTypeId: google.maps.MapTypeId.HYBRID //set MapTypeId as HYBRID
  });

Set HYBRID MaptypeId in Google Maps Example

<!DOCTYPE html>  
<html>  
<head><!-- www.techstrikers.com --> 
<title>Set HYBRID maptypeId in Google Map API</title>
  <style>
 html, body {  
	height: 100%;  
	margin: 0;  
	padding: 0;  
  }  
  #map {  
	height: 99%; 
	 width: 99%;
  }
</style>
<script async defer src="https://maps.googleapis.com/maps/api/js?
signed_in=true&callback=initialize"> </script> 
</script> 
<script> 
//initializing google maps API
function initialize() {
	//Set map center lat/lng
   var lat_lng = {lat: 20.08672, lng: 78.42444};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 6,
    center: lat_lng, // map center
    mapTypeId: google.maps.MapTypeId.HYBRID //set MapTypeId as HYBRID
  });
}
</script>
</head>
<body>
<div id="map"></div>
</body>
</html>

Above example will produce following output