Hi...
Toady I'll describe you How to use google map in your own web site.It's very very simple..Just paste this in you HTML (design)of the as[x page.
[title]Google Maps JavaScript API Example[/title]
[script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAlE4RDKqdaG_395uP5F3n5BSgLbdfLkC76Qf-PydYQ5rbBnOoOBQ5b6VRo9cSRp89ONhWflXcFjLUkA"
type="text/javascript"][/script]
[script type="text/javascript"]
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
geocoder = new GClientGeocoder();
var address ='[%=address %]'
//address variable is usedused for the Address to be serched
//code behind declaretion of 'address' Varialbe as follows
//protected string address = string.Empty; in partial class.. give the value ot it in any Event.
showAddress(map, geocoder, address);
//showAddress(map, geocoder, "76 9th ave new york");
}
}
function showAddress(map, geocoder, address)
{
if (geocoder) {
geocoder.getLatLng(
address,
function(point) {
if (!point) {
alert(address + " not Valid Address ");
} else {
map.setCenter(point, 13);
var baseIcon = new GIcon();
baseIcon.shadow = "images/red_star.gif";
baseIcon.iconSize = new GSize(19, 18);
baseIcon.shadowSize = new GSize(19, 18);
baseIcon.iconAnchor = new GPoint(9, 34);
baseIcon.infoWindowAnchor = new GPoint(9, 2);
// Creates a marker whose info window displays the letter corresponding
// to the given index.
function createMarker(point, index) {
// Create a lettered icon for this point using our icon class
var letter = String.fromCharCode("A".charCodeAt(0) + index);
var icon = new GIcon(baseIcon);
icon.image = "red_star.gif";
var marker = new GMarker(point, icon);
GEvent.addListener(marker, "click", function() {
marker.openInfoWindowHtml(address);
});
return marker;
}
map.addOverlay(createMarker(point, 13));
}
}
);
}
}
[/script]
With Love...
Sanjeev Kumar Chauhan
No comments:
Post a Comment