Pages

Powered By Blogger

Saturday, January 15, 2011

Case II

    

In this case, user wishes to display a map in his/her own web page centering a location and suppose coordinates of the location are not known and the map canvas size is 500 x 500 pixel at the center of the page. The page heading and title should be “Welcome to Second Map”.
          

            Step 1:

           
            Open http://maps.google.com, browse and spot place of your interest.

            Just right-click on the map and select "What's here?". The coordinates will automatically pop up in the search. In this way user can find Latitude,Longitude and the same values can be used in the following code.



            Step 2:
                   Type following given program in text editor

                                ======================================================
<html>
<head>
          <title>Welcome to Second Map</title>
<script type="text/javascript"     src="http://maps.google.com/maps/api/js?sensor=false"> </script>
<script type="text/javascript"> 
function initialize()
{     
var latlng = new google.maps.LatLng(Latitude ,Longitude);   
var myOptions = {      
zoom: 15,      
center: latlng,      
mapTypeId: google.maps.MapTypeId.ROADMAP    
};    
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);  
} 
</script>
</head>
<body onload="initialize()">  
<div id="map_canvas" style="width:500px; height:500px"></div>
</body>
</html>
                                ======================================================

          Step 3:
                   Save this document as “SecondMap.htm” and run the program using a browser.

Description

As described in Case I

2 comments: