The Zoom attribute is used to increase or decrease the zoom level on a specific point in maps. To customize the zoom level change the zoom value. The default value of zoom is 10.
Syntax:
var CustomOp = {
zoom:zoom value
};
Example 1: This example sets the zoom level at 10.
<!DOCTYPE html> <html> <head> <title> Google Maps | Zoom </title> <!-- Loading map API --> <script src= </script> <script> function GFG() { var CustomOp = { center:new google.maps.LatLng( 28.502212, 77.405603), zoom:10, mapTypeId:google.maps.MapTypeId.ROADMAP }; // Map object var map = new google.maps.Map( document.getElementById("DivID"), CustomOp ); } </script> </head> <!-- load map --><body onload = "GFG()"> <center> <h1 style="color:green">neveropen</h1> <h3>Google Maps</h3> <!-- Basic Container --> <div id = "DivID" style= "width:400px; height:300px;"> </div> </center> </body> </html> |
Output:
Example 2: This example sets the zoom level to 15.
<!DOCTYPE html> <html> <head> <title> Google Maps | Zoom </title> <!-- Loading map API --> <script src= </script> <script> function GFG() { var CustomOp = { center:new google.maps.LatLng( 28.502212, 77.405603), zoom:15, mapTypeId:google.maps.MapTypeId.ROADMAP }; // Map object var map = new google.maps.Map( document.getElementById("DivID"), CustomOp ); } </script> </head> <!-- load map --><body onload = "GFG()"> <center> <h1 style="color:green">neveropen</h1> <h3>Google Maps</h3> <!-- Basic Container --> <div id = "DivID" style= "width:400px; height:300px;"> </div> </center> </body> </html> |
Output:
Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!
