Google मानचित्र PanTo OnClick

Question

मैं क्लिक पर मानचित्र पर किसी क्षेत्र को पैन करने की कोशिश कर रहा हूं। लिपि काम नहीं कर रही है और पेज रीलोडिंग है। शायद कोई समस्या देख सकता है।

मेरे समारोह

function clickroute(lati,long) { 

     map = google.maps.Map(document.getElementById("map_canvas")); 
     map.panTo(lati,long) 
    } 

और बाकी

var directionDisplay; 
    var directionsService = new google.maps.DirectionsService(); 
    var map; 

    function initialize() { 
     geocoder = new google.maps.Geocoder(); 
    directionsDisplay = new google.maps.DirectionsRenderer(); 
    var chicago = new google.maps.LatLng(41.850033, -87.6500523); 
    var myOptions = { 
     zoom:10, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: chicago 
    } 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    var address = 'virginia water'; 
    geocoder.geocode({ 'address': address}, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
     map.setCenter(results[0].geometry.location); 
     var marker = new google.maps.Marker({ 
      map: map, 
      position: results[0].geometry.location 
     }); 
     } 
    }); 
    directionsDisplay.setMap(map); 
    } 

    function calcRoute() { 
    var start = document.getElementById("start").value; 
    var end = document.getElementById("end").value; 
    var request = { 
     origin:start, 
     destination:end, 
     travelMode: google.maps.DirectionsTravelMode.DRIVING 
    }; 
    directionsService.route(request, function(response, status) { 
     if (status == google.maps.DirectionsStatus.OK) { 
     directionsDisplay.setDirections(response); 
     } 
    }); 
    } 

और मेरे घटना

<a href="" onclick="clickroute(51.433373, -0.712251)">test</a> 

Answer 1

मुद्दा अपने map.panTo(latitude,longitude) लेकिन का उपयोग कर गूगल मैप्स एपीआई इस का उपयोग करता है: panTo(latLng myLatLng) जहां latLng एक Google मानचित्र वर्ग है।

इस (untested) की तरह कुछ

function clickroute(lati,long) { 
     var latLng = new google.maps.LatLng(lati, long); //Makes a latlng 
     map.panTo(latLng); //Make map global 
    } 

अधिक जानकारी के लिए देखो here प्रयास करें।

संपादित करें जैसा कि किसी और ने कहा है कि आप एक नया नक्शा रीमेक नहीं करना चाहते हैं। शायद इसे वैश्विक बनाना आसान है?

Answer 2

लाइन ...

map = google.maps.Map(document.getElementById("map_canvas")); 

.. वास्तव में #map_canvas डिव के भीतर एक नया नक्शा बनाने के लिए प्रयास कर रहा है। चूंकि वह मानचित्र पहले से मौजूद होना चाहिए, इसलिए आपको असाइनमेंट स्टेटमेंट की आवश्यकता नहीं है। बस

map.panTo(lati,long) 

काम करना चाहिए?

संपादित करें: के रूप में मानकों को न सिर्फ निर्देशांक क्षमा करें, SSRide360 सही है कि होना चाहिए ...

map.panTo(new google.maps.LatLng(lati, long)); 

Answer 3

Panto LatLng वस्तु स्वीकार करता है। पैन टू विधि को पास करने से पहले लैट्लिंग ऑब्जेक्ट बनाएं।

function clickroute(lati,long) { 
    map.panTo(new google.maps.LatLng(lati,long)); 
    return false; //this will cancel your navigation 
} 

आपका पृष्ठ पुनः लोड क्योंकि आपको लगता है कि आप एंकर टैग में डाल onClick में नेविगेशन घटना को रद्द नहीं है। उपरोक्त कोड में टिप्पणी देखें।

और दूसरों की तरह कहते हैं कि इस फ़ंक्शन से मानचित्र चर ले जाएं और मानचित्र को वैश्विक बनाएं।

Answer 4

आप भी मक्खी पर एक नया मार्कर सेट कर सकते हैं:

var LatLng = new google.maps.LatLng(lat, lng); 
    var marker = new google.maps.Marker({ 
       content: "<h2>Hier wohne ich!</h2>", 
       map: map,position: results[0].geometry.location 
       }); 
    map.panTo(LatLng);