Skip to main content

Simple Map using Google Maps API v3

       Let us begin with our first example using Google Maps API v3. Even before a marker - the most basic element of a map, appears, the map should be seen on the screen. Let us have a look at the following javascript code first. We will then have a look at the elements in the code.

            Ta-da a map in action! This map is centred at the Sansad Bhavan, New Delhi, India.
In the above code the head of the document contains a critical script element. Its src attribute points to the location of the API on Google's server. In API v3 there is no need to obtain a key for the API. The remaining is simple Javascript.

          Happy mapping!!!

Comments

  1. I need to use this, please help me regarding this

    what is the requestUrl and what is the response...is response is just an image!

    requesturl="http://www.maps.google.com/_some format_/searchstring/_some format_"

    ReplyDelete
  2. Firstly....response is not an image...It is a map like you can see on Google Maps home page http://maps.google.com/. You can copy paste my code in a simple file and save it as a html and view it in your browser.

    Secondly about the requestUrl...Go to google maps home page and search for anything you like. Search criteria could be latitude-longitude value or a place. You will find the URL at the top of the screen.

    ReplyDelete

Post a Comment

Please leave your comments here...

Recommended for You

Playing with the markers and info window bubbles...

    In the last few posts, we have seen some marker examples and some information window examples. Now, lets do something interesting combining these two things. Just writing that "This is an info window" in the information bubble is not very interesting! And I know this...Have gone through the same phase!     So, today we will do something interesting! We will display the latitude- longitude co-ordinates of the point that the user clicks on the map! Doing this is not at all complex! Copy paste the following code and you will see for yourself a map coming to life!     The output of the above code looks as seen in the result section above! If you have any queries regarding the above code please comment on the blog post or feel free to contact me at my mail ID .

Fusion Table - Heat Map Layer

    In continuation with the previous example on Fusion Table, we will have a look at another Fusion Table layer example. Today's point of discussion is heat map! What is a heat map? A heat map is geographical representation of data where the values taken by a variable in two-dimensional map are represented as colors. Higher the value of the variable, that place on the map would be represented with a deeper color.     This example is very much similar to the previous one, just for one minor change! Let us have a look at the code.     I have just used a readily available Google Fusion Table for this example. Any anomalies in the data is not my responsibility! Copy the above code in an html file and open it in your browser! You will see the fusion table heat map layer in action! The only change in this code from the previous one is that, the heatmap property of the fusion table layer is made true! The output of the above code looks as s...

Panoramia - Tag based search

    If you don't already know what Panoramia is, you can have a look at this link , to know more about Panoramia and a basic example. Today we will have a look at a more sophisticated example for Panoramia Layer in Google Maps API v3. In today's example we will search and display only those images on the map that have the tag that is being searched for.     The example is very simple and all you need to do is copy the following code in an html and open it in your browser. Search for whatever you want to and if there are images that have the same tag, then those images will appear on the map.     The output of the above code looks as it is seen in the result section above. Now you can enter your search parameter in the search box. I had entered "Fruits" and the output was as seen in the image below.     You can have your own search parameter. Enjoy the Panoramia ride!

Where on Google Map was Osama bin Laden?

                It took years of intelligence gathering and months of following leads and planning an attack for the US to track down the world’s most wanted criminal – Osama bin Laden to a compound in the normally quite city of Abottabad in Pakistan. Since the night when US President Barack Obama announced the terrorist’s death, the Internet has been buzzing with attempts by people all around the globe to pin- point the exact location of the compound on a map.                 Bin Laden's compound had been pinned in multiple different locations on Google Maps and Google Earth by users of Google's Map Marker web app, in various spots across Abbottabad. However, none were accurate and exact. Thanks to photos and diagrams released by the U.S. Dept. of Defense on Monday, Osama bin Laden’s Hideout Compound is now embedded in Google Maps and ...

Integrated GPS cameras...

          GeoSpatial Experts has introduced three new GPS Camera bundles designed specifically for geotagging and mapping digital photographs. The firm now offers its popular GPS-Photo Link 5.0 photo-mapping software with the new Ricoh G700SE, Sony A55, and Casio EX-H20G GPS cameras.           All of the GPS cameras below will provide you with geotagged photos, additionally, some can also offer the ability to capture the direction the photo was taken with a built-in compass, or the ability to collect attribute data in the field. WiFi and Bluetooth will allow you to communicate with laser range finder equipment to measure exact distance from the photographer to the item being photographed. Some GPS cameras provide a ruggedized camera to withstand harsh conditions.            In 2007, Ricoh introduced its 500SE model as the first GPS-eq...