Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Allowing users to add markers to google maps and getting the coordinates

Tags:

What i want to do is embed a map on my website and allow users to place markers on it (also if there is a way to control how many markers a user can put on the map?) and i also want to get the coordinates of these markers once they have been put on the map. From the documentation that i've read for google maps javascript api V3, i can place markers on the map myself, but i dont see a way to let users put them up on the map. Is there a way to do it?

like image 564
tapan Avatar asked Apr 22 '11 16:04

tapan


People also ask

How do I get the coordinates of a marker on Google Maps?

Browser: At googlemaps.com, enter a location in the search box. Right-click the map location. Copy the GPS coordinates in the pop-up window.

Is Google Map API free?

You won't be charged until your usage exceeds $200 in a month. Note that the Maps Embed API, Maps SDK for Android, and Maps SDK for iOS currently have no usage limits and are at no charge (usage of the API or SDKs is not applied against your $200 monthly credit).

Which function should you use if you want to add markers to display a specific location on a map that you draw?

If you do not specify the map on construction of the marker, the marker is created but is not attached to (or displayed on) the map. You may add the marker later by calling the marker's setMap() method.


1 Answers

Source: http://code.google.com/apis/maps/documentation/javascript/events.html Scroll down to accessing arguments in UI events.

var map; function initialize() {   var myLatlng = new google.maps.LatLng(-25.363882,131.044922);   var myOptions = {     zoom: 4,     center: myLatlng,     mapTypeId: google.maps.MapTypeId.ROADMAP   }   map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);    google.maps.event.addListener(map, 'click', function(event) {     placeMarker(event.latLng);   }); }  function placeMarker(location) {   var marker = new google.maps.Marker({       position: location,        map: map   });    map.setCenter(location); } 
like image 137
tapan Avatar answered Oct 08 '22 15:10

tapan