Home » » Add Google Map to your website

Add Google Map to your website

Written By Unknown on Rabu, 19 September 2012 | 00.23

Adding maps to your site is quite easy with Google Maps Api V3.
Before you proceed with the working with Google Map Api you need an API Key from Google. You can create an API Key by signing into your Google Account.

To create your API key follow the instructions:
  1. Visit the APIs Console at https://code.google.com/apis/console
  2. Log in with your Google Account.
  3. Click the Services link from the left-hand menu.
  4. Activate the Google Maps API v3 service.
  5. Click the API Access link from the left-hand menu.
You will get your API Key under Simple API Access section.

Now you are ready to Create a Google Map. Use your own API Key in the following url used in the sample code.

http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=false_or_true

Sample code is given here


<!DOCTYPE html>
<html>
<head>
<script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCEnBxzr2jFxZ7zrZ0LcT-lx6ojzFijk3U&sensor=false">
</script>

<script>
var place=new google.maps.LatLng(28.632778,77.219722);

function initialize(){
var param = {
center:place,
zoom:12,
mapTypeId:google.maps.MapTypeId.ROADMAP
};
var map=new google.maps.Map(document.getElementById("myMap"),param);

var marker=new google.maps.Marker({
position:place
});
marker.setMap(map);
}
google.maps.event.addDomListener(window,'load',initialize);
</script>
</head>
<body>
<div id="myMap" style="width:450px;height:320px;"></div>
</body>
</html>


Output of the above code


Share this article :

Posting Komentar

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Kumpulan Kata Broadcast Blackberry - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger