谷歌地图.fitBounds（）和自定义偏移中心？

Question

我正在使用这个函数，它给出了一个latlong，它考虑到offsetX和offsetY将谷歌地图居中：

customCenter: function ( latlng, offsetx, offsety ) {
    // latlng is the apparent centre-point
    // offsetx is the distance you want that point to move to the right, in pixels
    // offsety is the distance you want that point to move upwards, in pixels
    var self = this;

    var scale = Math.pow(2, self.map.getZoom());
    google.maps.event.addListenerOnce(self.map,"projection_changed", function() {
        var worldCoordinateCenter = self.map.getProjection().fromLatLngToPoint(latlng);
    var pixelOffset = new google.maps.Point((offsetx/scale) || 0,(offsety/scale) ||0)

    var worldCoordinateNewCenter = new google.maps.Point(
        worldCoordinateCenter.x - pixelOffset.x,
        worldCoordinateCenter.y + pixelOffset.y
    );

    var newCenter = self.map.getProjection().fromPointToLatLng(worldCoordinateNewCenter);
        self.map.setCenter(newCenter);
    });
}

我正在使用它，所以：

self.customCenter (marker.position, $('aside').width(), 0 );

但是现在他们要求我补偿偏移量（所以没有一个标记在视线之外

（通常如此使用:)

var bounds = new google.maps.LatLngBounds();
bounds.extend(myPlace);
bounds.extend(Item_1);
bounds.extend(Item_2);
bounds.extend(Item_3);
self.map.fitBounds(bounds);

但我没有看到将这两种功能结合起来的方法

（这是因为我在谷歌地图上有一个浮动（pos：绝对），就像我在网上找到的这个图像一样：

）

有什么想法吗？

- 我现在正在这样做：

customCenterWithBounds: function ( offsetx, offsety ) {
    // offsetx is the distance you want that point to move to the right, in pixels
    // offsety is the distance you want that point to move upwards, in pixels
    var self = this;

    self.map.fitBounds(self.bounds);

    var mapCenter = self.map.getCenter();
    var latlng = new google.maps.LatLng (mapCenter.lat(), mapCenter.lng() );

    var scale = Math.pow(2, self.map.getZoom());
    google.maps.event.addListenerOnce(self.map,"projection_changed", function() {
        var worldCoordinateCenter = self.map.getProjection().fromLatLngToPoint(latlng);
    var pixelOffset = new google.maps.Point((offsetx/scale) || 0,(offsety/scale) ||0)

    var worldCoordinateNewCenter = new google.maps.Point(
        worldCoordinateCenter.x - pixelOffset.x,
        worldCoordinateCenter.y + pixelOffset.y
    );

    var newCenter = self.map.getProjection().fromPointToLatLng(worldCoordinateNewCenter);
        self.map.setCenter(newCenter);
    });
}

但是地图会过度缩放..甚至不在可见区域的中心..

Answer 1

我最终做了这个

customCenter: function (offsetx, offsety, bounds_obj ) {
    if ($(window).width() <= 1200 ) {
        offsetx = 0;
    }
    var self = this;

    google.maps.event.addListenerOnce(self.map,"projection_changed", function() {
        var latlng;
        var fbObj = self.map.fitBounds(self.bounds);
        var mapCenter = self.map.getCenter();

        latlng = new google.maps.LatLng(mapCenter.lat(), mapCenter.lng());

        var scale = Math.pow(2, self.map.getZoom());

        var worldCoordinateCenter = self.map.getProjection().fromLatLngToPoint(latlng);
        var pixelOffset = new google.maps.Point((offsetx/scale) || 0,(offsety/scale) ||0)

        var worldCoordinateNewCenter = new google.maps.Point(
            worldCoordinateCenter.x - pixelOffset.x,
            worldCoordinateCenter.y + pixelOffset.y
        );

        var newCenter = self.map.getProjection().fromPointToLatLng(worldCoordinateNewCenter);
        self.map.setCenter(newCenter);
    });
}