I am a very big fan of the Google Maps. Its too good to find your home, office, various buildings, cities, and other places across the world in your computer screen with the help of Google Maps.

Some days back I was visiting Google’s Code & API section and found ‘Google Maps API’ which we can use to display Google Maps in our websites. Then I tried to develop a sample webpage to implement this Google Maps API and can you imagine, it has taken only 5 minutes to configure and running Google Maps in my sample page. 

To implement Google Maps API, I have used following steps:

Step1: Sign up for a Google Maps API key.
While sign up for the Google Maps API key, it asks for your website URL that it allows you to use the generated key to display Google Map in the specified URL only. Please also enter your website URL without ‘www’ i.e. you must enter your website URL like ‘http://sitename.com’.

You can sign up for Google Maps API key at: http://www.google.com/apis/maps/signup.html

Step2: Now create a new web page with the following HTML code:

<html>
<head>
<title>Google Maps API Example</title>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp; sensor=true&amp;key=YOUR_GOOGLE_MAPS_API_KEY" type="text/javascript"></script>
<script type="text/javascript">
function initialize()
{
 if (GBrowserIsCompatible())
 {
  var map = new GMap2(document.getElementById("Google_Map_Container"));
  map.setCenter(new GLatLng(37.4419, -122.1419), 13);
  map.setUIToDefault();
 }
}
</script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div style="width: 500px; height: 500px" id="Google_Map_Container"></div>
</body>
</html>

In the above code, “YOUR_GOOGLE_MAPS_API_KEY” is the Google Maps API key which you have created for your website URL, and “Google_Map_Container” is DIV control where Google Maps will be displayed.

Now you just open this web page in the web browser, Google Maps will be displayed in your page. You can also upload this web page to your web website hosting server to make Google Maps accessible from your website.

I have used the above code to merge the Google Maps in this page which will looks like as below: