In the previous post, we have seen how to find the latitude and longitude of any location in Google Maps. As a follow-up post, I’m now going show you a simple step to embed basic Google maps of any location by only changing the Latitude & Longitude. To do so you need Latitude & Longitude of the location you want to embed.
Google provide a simple HTML code to embed Google Maps in your website. Refer post.
Code Snippet:
<html>
<head>
<style>
#map_canvas {
width: 500px;
height: 400px;
}
</style>
<script src=”https://maps.googleapis.com/maps/api/js?sensor=false”></script>
<script>
function initialize() {
var map_canvas = document.getElementById(‘map_canvas’);
var map_options = {
center: new google.maps.LatLng(44.5403, -78.5463),
zoom:8,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(map_canvas, map_options)
}
google.maps.event.addDomListener(window, ‘load’, initialize);
</script>
</head>
<body>
<div id=”map_canvas”></div>
</body>
</html>
Here change the values of Latitude and Longitude of your location.
center: new google.maps.LatLng(44.5403, -78.5463),
You can also change the zoom level by modifying the values of
zoom:8,
Increase the value ‘8’ to Zoom in and decrease to Zoom Out.
Specify the width & height of the map you are going embed.
width: 500px;
height: 400px;
Highlighted fields need to be changed. Hope this tutorial will be helpful to you.
