Wie versetze ich den Mittelpunkt eines Google Maps (API v3) in Pixel?

Question

Ich frage mich, ob es möglich ist, Offset das Zentrum einer Karte in Google Maps API v3. Ich möchte diesen Offset in Pixel kontrollieren, da lat und lng falsch und sehr schwer vorherzusagen scheint.

Ich muss nur eine Markierung platzieren und dann die Mitte um 250px versetzen, damit ich etwas anderen Inhalt in der Mitte der Karte platzieren kann.

Hoffe jemand kann helfen!

Answer 1

diese Frage bei der Erforschung und dachte, sollte ich eine Antwort geben:

function map_recenter(latlng,offsetx,offsety) { 
    var point1 = map.getProjection().fromLatLngToPoint(
     (latlng instanceof google.maps.LatLng) ? latlng : map.getCenter() 
    ); 
    var point2 = new google.maps.Point(
     ((typeof(offsetx) == 'number' ? offsetx : 0)/Math.pow(2, map.getZoom())) || 0, 
     ((typeof(offsety) == 'number' ? offsety : 0)/Math.pow(2, map.getZoom())) || 0 
    ); 
    map.setCenter(map.getProjection().fromPointToLatLng(new google.maps.Point(
     point1.x - point2.x, 
     point1.y + point2.y 
    ))); 
} 

Wenn Ihr Google Maps Variable nicht map ist verwenden Sie die folgende Aufruf Funktionsreferenz:

function map_recenter(map,latlng,offsetx,offsety) { ... 

Answer 2

Werfen Sie einen Blick auf die MapCanvasProjection Objekt - http://code.google.com/apis/maps/documentation/javascript/reference.html#MapCanvasProjection

Sie können die Karte Zentrum latLng (map.getCenter()) erhalten dann das Pixel in den Behälter konvertieren mit fromContainerPixeltoLatLng Koordinaten()

Answer 3

gibt es auch die Die Methode panBy des Kartenobjekts ... kann um eine angegebene Anzahl von Pixeln versetzt werden. Sie erhalten jedoch eine sanfte Übergangsanimation, die möglicherweise nicht Ihren Vorstellungen entspricht. Ich suche selbst das Gleiche, werde dich wissen lassen, was ich finde.

Answer 4

dazu finden Frage: How to offset the center of a Google maps (API v3) in pixels?

Dies ist eine Modifikation einer Antwort, die ich here zur Verfügung gestellt habe.

google.maps.Map.prototype.setCenterWithOffset= function(latlng, offsetX, offsetY) { 
    var map = this; 
    var ov = new google.maps.OverlayView(); 
    ov.onAdd = function() { 
     var proj = this.getProjection(); 
     var aPoint = proj.fromLatLngToContainerPixel(latlng); 
     aPoint.x = aPoint.x+offsetX; 
     aPoint.y = aPoint.y+offsetY; 
     map.setCenter(proj.fromContainerPixelToLatLng(aPoint)); 
    }; 
    ov.draw = function() {}; 
    ov.setMap(this); 
}; 

Anschließend können Sie es wie so verwenden:

var latlng = new google.maps.LatLng(-34.397, 150.644); 
var map = new google.maps.Map(document.getElementById("map_canvas"), { 
    zoom: 8, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    center: latlng 
}); 

map.setCenterWithOffset(latlng, 0, 250); 

Hier ist ein funktionierendes example.