fitbounds() in Google Maps api V3 passt nicht Grenzen

Ich verwende den Geocoder von Google API v3, um eine Karte eines Landes anzuzeigen. Ich bekomme das empfohlene Ansichtsfenster für das Land, aber wenn ich die Karte in dieses Ansichtsfenster anpassen möchte, funktioniert es nicht (siehe die Grenzen vor und nach dem Aufruf der Funktion fitBounds im folgenden Code).fitbounds() in Google Maps api V3 passt nicht Grenzen

Was mache ich falsch?

Wie kann ich das Ansichtsfenster meiner Karte auf results[0].geometry.viewport einstellen?

var geocoder = new google.maps.Geocoder(); 
geocoder.geocode(
    {'address': '{{countrycode}}'}, 
    function(results, status) { 
     var bounds = new google.maps.LatLngBounds(); 
     bounds = results[0].geometry.viewport; 
     console.log(bounds);   // ((35.173, -12.524), (45.244, 5.098)) 
     console.log(map.getBounds()); // ((34.628, -14.683), (58.283, 27.503)) 
     map.fitBounds(bounds);    
     console.log(map.getBounds()); // ((25.740, -24.806), (52.442, 17.380)) 
    } 
);

Quelle

2010-03-22 jul

Dies geschieht, weil die fitBounds() zu einem Ansichtsfenster schnappen muss, die die Karte Leinwand passt die maximale Zoomstufe möglich verwenden. Auf der anderen Seite hängt das vom Geocoder zurückgegebene Ansichtsfenster nicht von der Größe, dem Layout oder der Zoomstufe des Kartenbereichs ab. Daher passt die fitBounds() Methode das Ansichtsfenster der Karte an, um die übergebenen LatLngBounds vollständig in der Mitte der Karte anzuzeigen.

Sie können das folgende Beispiel für eine klarere Demonstration überprüfen:

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps fitBounds Demo</title> 
    <script src="http://maps.google.com/maps/api/js?sensor=false" 
      type="text/javascript"></script> 
</head> 
<body> 
    <div id="map" style="width: 500px; height: 350px"></div> 

    <script type="text/javascript"> 
     var myOptions = { mapTypeId: google.maps.MapTypeId.ROADMAP }; 
     var map = new google.maps.Map(document.getElementById("map"), myOptions); 
     var geocoder = new google.maps.Geocoder(); 

     geocoder.geocode({'address': 'RU'}, function (results, status) { 
     var ne = results[0].geometry.viewport.getNorthEast(); 
     var sw = results[0].geometry.viewport.getSouthWest(); 

     map.fitBounds(results[0].geometry.viewport);    

     var boundingBoxPoints = [ 
      ne, new google.maps.LatLng(ne.lat(), sw.lng()), 
      sw, new google.maps.LatLng(sw.lat(), ne.lng()), ne 
     ]; 

     var boundingBox = new google.maps.Polyline({ 
      path: boundingBoxPoints, 
      strokeColor: '#FF0000', 
      strokeOpacity: 1.0, 
      strokeWeight: 2 
     }); 

     boundingBox.setMap(map); 
     }); 
    </script> 
</body> 
</html>

Im Folgenden sind einige Screenshots für verschiedene Länder aus dem obigen Beispiel. Die rote Begrenzungsbox ist das vom Geocodierer zurückgegebene Ansichtsfenster. Beachten Sie den Unterschied zwischen dem Begrenzungsrahmen und dem eigentlichen Ansichtsfenster, wie fitBounds() eingestellt:

Land: US

Land: RU

Land: IT

Quelle

2010-03-22 23:45:16

Danke Daniel. – jul

Ich hatte Probleme zu verstehen, wie man das auch macht, super detaillierte Erklärung! – designermonkey

Vielen Dank für die gründliche Erklärung. Die BoundingBox war eine großartige Idee, um das klar zu machen. – Symmetric

Nur, damit Sie in welcher Weise weiß, das individuell angepasst werden kann, habe ich eine Probe vorbereitet haben, was Sie tun können, wenn Sie es vorziehen, mit nur einige der boundingBox im Ansichtsfenster

eine Probe zu verlieren fitBounds : http://jsbin.com/cakuhaca/1/edit
eine Probe, wenn Sie kümmern sich nicht, dass alle Ansichtsfenster sichtbar ist und zoomen immer mehr Ebene in einem: http://jsbin.com/rofupidi/1/edit
eine Probe, wenn Sie nur, wenn Sie die Stip von th Pflege Die Begrenzungsbox, die Sie verlieren, ist mehr als X Pixel in horizontal oder vertikal http://jsbin.com/rezapuye/1/edit

Quelle

2012-10-30 10:49:08 kaskader

:(Diese Verbindung ist tot. –

behoben mit einer permanenteren Verbindung – kaskader

tot wieder ..... –

fitbounds() in Google Maps api V3 passt nicht Grenzen

Antwort

Verwandte Themen