In aspx page add Google Map API KEY in header part of html....like this
<head >You can get your own google map api key from this link. You can place your url
<script src="http://maps.google.com/maps?file=api&v=2& key=ABQIAAAAclK0B2lXQwV5lPy1rLiTFBSN1aiKepvDswXjKa4j2DDWdYvOjhQMO1tywqS8ObgP5dtO70AyyArhzA"
type="text/javascript"> </script >
</head>
in " My web site url " box. One can also get api key for http://localhost. See the below pictures...
http://code.google.com/apis/maps/signup.html
0In html body take a <div> with a height and width. It is used for loading google map in your application. Like this..
<form id="form1" runat="server">Then place this javascript code before close the </head> tag:
<div>
<div id="Gmap" style="width: 700px; height: 700px"></div>
</div>
</form>
<script type="text/javascript">In this javascript function use several functions for getting some google map features ....
var map = null;
var geocoder = null;
function loadGmap() {
if (GBrowserIsCompatible()) {
var point;
var map = new GMap2(document.getElementById("Gmap"));
map.addControl(new GOverviewMapControl());
map.enableDoubleClickZoom();
map.enableScrollWheelZoom();
map.addControl(new GMapTypeControl());
map.addControl(new GSmallMapControl());
var address = gmapAddress;
point = new GLatLng(gmapLat,gmapLng);//new GLatLng(22.592057, 88.421815);
var marker = new GMarker(point);
map.setCenter(point, 17);
map.addOverlay(marker);
map.setMapType(G_HYBRID_MAP);
GEvent.addListener(marker, "mouseover", function() { marker.openInfoWindowHtml(address); });
marker.openInfoWindowHtml(address);
map.setCenter(point, 17);
}
}
//]]>
</script >
GBrowserIsCompatible()-- its a function which will return true only if your browser is compatible with google map.Add a google map load function in body tag..
GMap2 -- function takes the control to load and returns a map object to the reference div.
addControl() --add a new control to the map
GOverviewMapControl() -- it will be shown an overview of the map just in the right hand bottom corner to the map.
GSmallMapControl() -- add a zoom control to the map
GMapTypeControl() -- add new map type control in gmap. There are mainly 3 types of map, one is Normal, Satellite and Hybrid.
enableDoubleClickZoom -- Doubleclick zoom is available to gmap.
enableScrollWheelZoom -- Scrollwheel for mouse is available to gmap.
< body onload="loadGmap();" onunload="GUnload()" style=" background-color:Transparent" >
You will get more from these links.. very useful reference for developers..
http://www.codeproject.com/KB/scripting/Use_of_Google_Map.aspx
http://www.codeproject.com/KB/web-image/Google_map.aspx
11 comments:
I love your site, but honestly tell you that you need more for him to monitor those who commented with your records
thanks for your suggestions....
Hello, you site is very funny he told me to cheer up .. Merry Christmas.
You burn ... .. thought ... .... Cool !!!!!! 10
Merry Christmas and Happy New Year, may all your wishes come true!
Merry Christmas and Happy New Year, may all your wishes come true!
Merry Christmas! Let the new year will bring a lot of money
Interesting for me//
/
Useful publication and excellent presentation!
Good article. Thank you.
http://ordererimin.putblog.com/2011/01/10/information-difenoxin/
Hi Thanks for sharing your thoughts. Take care.
Post a Comment