Solved

How to set google map marker by latitude and longitude and provide infomation bubble

Posted on 2013-05-31
3
2,083 Views
Last Modified: 2013-06-05
Hi

The following sample code provided by google maps api
var geocoder;
          var map;
          function initialize() {
            geocoder = new google.maps.Geocoder();
            var latlng = new google.maps.LatLng(40.77627, -73.910965);
            var myOptions = {
              zoom: 8,
              center: latlng,
              mapTypeId: google.maps.MapTypeId.ROADMAP
            }
            map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
          }

Open in new window

the following only shows google map of the location without a marker. I was wondering how I can place a marker by giving latitude/longitude parameters?

Thanks in advance! any help is appreciated.
0
Comment
Question by:krushnac
3 Comments
 
LVL 9

Expert Comment

by:TvMpt
ID: 39210284
Just check this demo
I think that is what you are looking for...

http://jsfiddle.net/kjy112/ZLuTg/
0
 
LVL 7

Expert Comment

by:Robert Saylor
ID: 39210402
I have this working on one of our internal webpages.

Note: I am passing longitude and latitude from our internal database. This might get you going from this example.

         
<iframe width=\"500\" height=\"350\" id=\"location\" frameborder=\"0\" scrolling=\"no\" marginheight=\"0\" marginwidth=\"0\"
         src=\"https://maps.google.com/maps?q=$row[latitude],+$row[longitude]&amp;hl=en&amp;ie=UTF8&amp;t=m&amp;z=14&amp;iwloc=A&amp;ll=$row[latitude],$row[longitude]&amp;output=embed\">
         </iframe>

Open in new window

0
 
LVL 15

Accepted Solution

by:
eemit earned 250 total points
ID: 39210423
Try to add this:
            //setup the red pin marker
            marker = new google.maps.Marker({
                map:map,
                position:latlng,
                draggable:false
            });

            contentString = 'Your Info Window Content';
            infoWindow = new google.maps.InfoWindow({
                content:contentString
            });

            infoWindow.open(map, marker);

Open in new window

below the line:
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Part of the Global Positioning System A geocode (https://developers.google.com/maps/documentation/geocoding/) is the major subset of a GPS coordinate (http://en.wikipedia.org/wiki/Global_Positioning_System), the other parts being the altitude and t…
Many old projects have bad code, but the budget doesn't exist to rewrite the codebase. You can update this code to be safer by introducing contemporary input validation, sanitation, and safer database queries.
The viewer will learn how to count occurrences of each item in an array.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.

679 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question