Google मानचित्र एपीआई वी 3 अपडेट मार्कर

Question

मेरे पास एक नक्शा है जो लोड करता है। मैं एक मार्कर जोड़ना चाहता हूं जो इसे लेट और टेक्स्ट बॉक्स से लंबा हो, और मैं इसे समझ नहीं पा रहा हूं।

कुछ भी नहीं होता जब मैं अद्यतनमैप बटन पर क्लिक करता हूं।

यहाँ अब तक मेरी कोड है:

$(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

अद्यतन

इसके अलावा, अपने वैश्विक map संदर्भ वास्तविक मानचित्र उदाहरण के लिए सेट नहीं किया जाता क्योंकि आप इसे एक स्थानीय var ही नाम के साथ शैडो।

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

यह होना चाहिए सिर्फ

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

---

आप lat और lng का उपयोग कर रहे मार्कर स्थिति के लिए इससे पहले कि वे प्रारंभ कर रहे हैं (जब तक कि वे विश्व स्तर पर कहीं न कहीं पूरी तरह तैयार हैं):

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

यदि आप एक ही मार्कर की स्थिति अपडेट करना चाहते हैं और एक नया निर्माण नहीं करना चाहते हैं, तो आप sh बस ऐसा करने जा ould:

$("#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

पहले, initialize समारोह में आप नए स्थानीय map चर बना रहे हैं, क्योंकि आप var कीवर्ड का उपयोग करें। यह चर initialize के बाहर दिखाई नहीं दे रहा है, इसलिए आपको वैश्विक चर का उपयोग करने के लिए var को निकालना होगा।

दूसरा, आप परिभाषित होने से पहले lat और lng चर का उपयोग कर रहे हैं।

तीसरा, वैरिएबल को परिभाषित नहीं किया जा सकता है, तो आप विधि विधि तक पहुंच रहे हैं।

इन सब फिक्सिंग के बाद अपने कोड कुछ ऐसा दिखाई देगा:

$(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); 
});