Google Maps api V3 marcador de actualización

Question

Tengo un mapa que carga. Quiero agregar un marcador que obtenga su latitud y longitud de los cuadros de texto, y no puedo comprenderlo.

No ocurre nada cuando hago clic en el botón de actualización.

Aquí está mi código hasta ahora:

$(document).ready(function() { 
    alert("Dom, dom dom dom dom"); 


var map; 
var marker; 

function initialize() { 
    var myLatlng = new google.maps.LatLng(40.65, -74); 
    var myOptions = { 
     zoom: 2, 
     center: myLatlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
    } 

    var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 
} 



$("#updateMap").click(function(){ 


    var newLatLng = new google.maps.LatLng(lat, lng); 
    marker.setPosition(newLatLng); 

    var lat = parseFloat(document.getElementById('markerLat').value); 
    var lng = parseFloat(document.getElementById('markerLng').value); 
    var newLatLng = new google.maps.LatLng(lat, lng); 


    marker = new google.maps.Marker({ 
     position: newLatLng, 
     map: map, 
     draggable: true 
    }); 


}); 


}); 



// Onload handler to fire off the app. 
google.maps.event.addDomListener(window, 'load', initialize); 

}); 

Answer 1

actualización

Además, su referencia mundial map no se ajusta a la instancia de un mapa real, ya que la TI paralela con un var mismo nombre local.

var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 

Esto debería ser sólo

map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 

---

Estás usando lat y lng de la posición del marcador antes de que se inicializan (a menos que estén a nivel mundial establecen en alguna parte):

var newLatLng = new google.maps.LatLng(lat, lng); 
marker.setPosition(newLatLng); 

Si desea actualizar la posición del mismo marcador y no crear uno nuevo, usted sh Ould simplemente estar haciendo esto:

$("#updateMap").click(function(){ 
    var lat = parseFloat(document.getElementById('markerLat').value); 
    var lng = parseFloat(document.getElementById('markerLng').value); 
    var newLatLng = new google.maps.LatLng(lat, lng); 
    marker.setPosition(newLatLng); 
}); 

Answer 2

primer lugar, en función de initialize se están creando nuevos map variable local, ya que se utiliza la palabra clave var. Esta variable no está visible fuera de initialize, por lo que debe eliminar var para usar la variable global.

En segundo lugar, está utilizando lat y lng variables antes de que se definan.

En tercer lugar, está accediendo al método de la variable cuando no está definido.

Después de fijar todos ellos su código puede tener este aspecto:

$(document).ready(function() { 
    alert("Dom, dom dom dom dom"); 

    var map; 
    var marker; 

    function initialize() { 
     var myLatlng = new google.maps.LatLng(40.65, -74); 
     var myOptions = { 
      zoom: 2, 
      center: myLatlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
     } 

     map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 
    } 

    $("#updateMap").click(function(){ 

    var lat = parseFloat(document.getElementById('markerLat').value); 
    var lng = parseFloat(document.getElementById('markerLng').value); 
    var newLatLng = new google.maps.LatLng(lat, lng); 

    if (marker != undefined) 
     marker.setPosition(newLatLng); 
    else 
     marker = new google.maps.Marker({ 
      position: newLatLng, 
      map: map, 
      draggable: true 
     }); 
    }); 
    // Onload handler to fire off the app. 
    google.maps.event.addDomListener(window, 'load', initialize); 
});