Recommended Tips

Below are some simple tips showing how to use google maps on your site :

to use google maps, u will need to do some API programming basics as shown below :

” var map = new gmap2(document.getelementbyid(“map_canvas”)); ”

and also u need some basic HTML language.

Below are the steps u need to do :

1. Inside <body> :

a. Load Map function

b. Define the map display area using width and height inside <div>

2. Inside <Head> :

a. Define the map API Version, GPS censor and developer key which u can get from

code.google.com/apis/maps/signup.html

b. For version, version 2.x (which indicate version 2.1,2.2, etc) are the stable version.

c. Initialize the map object

d. Set the center of the object

e. Select title Style

f. Add Control

g. Add marker

Source code for embed google maps :

<html>

<head>

<script

src=”http://maps.google.com/maps?file=api&v=2.73&key=ABQIAAAA-O3c-Om9OcvXMOJXreXHAxSsTL4W

IgxhMZ0ZK_kHjwHeQuOD4xSbZqVZW2U_OWOxMp3YPfzZl2GavQ”

type=”text/javascript”></script>

jQuery(function() {

if (GBrowserIsCompatible()) {

var map = new GMap2(document.getElementById(‘map_canvas’));

var marker = new GMarker(new GLatLng(37.4228, -122.085));

var html = ‘<div style=”width:210px; padding-right:10px;”>’+

‘<a href=”signup.html”>Sign up</a> for a Google Maps API key’+

‘, or <a href=”documentation/index.html”>read more about the’+

‘ V2 API</a>.<br /><br /> Looking for the new ‘+

‘<a href=”/apis/maps/documentation/v3/”>V3 API</a>?</div>’;

map.setCenter(new GLatLng(37.4328, -122.077), 13);

map.addControl(new GSmallMapControl());

map.addOverlay(marker);

marker.openInfoWindowHtml(html);

}

});

</head>

</html>

if u follow the above tips, u will manage to add google maps into your site as follow :

Don’t forget to leave a reply..

DIGITAL ENTERPRISE