Wednesday, June 29, 2011

Part I. Simple Embedding of Google Maps using Google Maps API








This tutorial was adapted from the Google Maps API tutorial found here.

1. Open up a text editor and copy and paste the code below and save as something.html

2. After you have saved the file, open the file in a browser and you should see something like the image below. It is a HYBRID view map centered at Columbia University.



3. You can play around with the map by changing where the map is centered by changing the latitude and longitude on line 15. i.e. (NewLatitude,NewLongitude) Save the page after you made the change and you should see the map centered in a different location.

4. Change the zoom by changing the number on line 17 to something between 1-19 and you can change the default zoom of the map.

5. On line 19, if you change the word that is in ALL CAPITAL LETTERS to something else, you can change the type of map you are viewing. Google Maps API supports four different types of map views: 1) HYBRID 2) ROADMAP 3) SATELLITE 4) TERRAIN.

6. On line 27, you can change the height and width of the map by adjusting the width% and the height%.

No comments :