google maps set and get center with offset
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);
};
// modified version that only returns a 'settable' center
// using the (angularjs) $q promise service:
google.maps.Map.prototype.getCenterWithOffset = function(latlng, offsetX, offsetY) {
var deferred = $q.defer();
var map = this;
var ov = new google.maps.OverlayView();
var offsetCenter;
ov.onAdd = function() {
var proj = this.getProjection();
var aPoint = proj.fromLatLngToContainerPixel(latlng);
aPoint.x = aPoint.x+offsetX;
aPoint.y = aPoint.y+offsetY;
offsetCenter = proj.fromContainerPixelToLatLng(aPoint);
deferred.resolve(offsetCenter);
};
ov.draw = function() {};
ov.setMap(this);
return deferred.promise;
};
// Using A
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);
// or to get center:
map.getCenterWithOffset(this.getPosition(), 75, 0).then(function(offsetCenter) {
map.setCenter(offsetCenter);
});