Google V3 Map Adds Markers

Question

I need a code that allows users to add their own markers to my map. Does anyone have an example?

Thanks!

var initialLocation; var siberia = new google.maps.LatLng(60, 105); var newyork = new google.maps.LatLng(40.69847032728747, -73.9514422416687); var browserSupportFlag = new Boolean(); var stockholm = new google.maps.LatLng(59.32522, 18.07002); var parliament = new google.maps.LatLng(59.327383, 18.06747); var marker; var map; function initialize() { var myOptions = { zoom: 6, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); // Try W3C Geolocation (Preferred) if(navigator.geolocation) { browserSupportFlag = true; navigator.geolocation.getCurrentPosition(function(position) { initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude); map.setCenter(initialLocation); }, function() { handleNoGeolocation(browserSupportFlag); }); // Try Google Gears Geolocation } else if (google.gears) { browserSupportFlag = true; var geo = google.gears.factory.create('beta.geolocation'); geo.getCurrentPosition(function(position) { initialLocation = new google.maps.LatLng(position.latitude,position.longitude); map.setCenter(initialLocation); }, function() { handleNoGeoLocation(browserSupportFlag); }); // Browser doesn't support Geolocation } else { browserSupportFlag = false; handleNoGeolocation(browserSupportFlag); } function handleNoGeolocation(errorFlag) { if (errorFlag == true) { alert("Geolocation service failed."); initialLocation = newyork; } else { alert("Your browser doesn't support geolocation. We've placed you in Siberia."); initialLocation = siberia; } } } 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); $.ajax({ url: 'myPHP', data: location, succes: function(){ alert('marker was added'); }, error: function(){ alert('marker wasn't added'); marker.setMap(null); } }); } </script> 

Answer 1

This is not hard work:

• Set the click event on the map

    google.maps.event.addListener (map, 'click', function (event) {
     placeMarker (event.latLng);
   }); 

• Place a token and make an AJAX call to the server to save the location in the database:

    function placeMarker (location) {
     var marker = new google.maps.Marker ({
         position: location, 
         map: map
     });
  
  
     map.setCenter (location);
  
  
     $ .ajax ({
        url: 'myPHP',
        data: location,
        succes: function () {
          alert ('marker was added');
        },
        error: function () {
          alert ('marker wasn't added');
          marker.setMap (null);
        }
     });
   } 

Answer 2

Or use the MarkerManager for the v3 map APIs and get rid of any other small error that you could implement (for example, moving markers, etc.). )