Карты Google .fitBounds() и пользовательский offsetCenter?

Я использовал эту функцию, которая, учитывая широту, центрирует карты Google с учетом смещения X и смещения Y:

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);

Но я не вижу способа совместить эти две функции.

(это потому, что у меня есть aside, плавающий ( pos: absolute ) над картами Google, как это изображение, которое я нашел в Интернете:

введите здесь описание изображения

)

Любые идеи?

- Я сейчас так пытаюсь:

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);
    });
}

Но карта была бы чрезмерно увеличена... и даже не в центре видимой области..


person Toni Michel Caubet    schedule 06.07.2017    source источник
comment
Вы проверили этот вопрос SO? developers.google.com/maps/documentation/javascript/ Я не не нравится самый высокий ответ, но те, что ниже, могут вам помочь: fitBoundsWithPadding.   -  person shotor    schedule 06.07.2017
comment
Спасибо за предложение, но вы уверены, что это правильная ссылка? Я вижу страницу документации   -  person Toni Michel Caubet    schedule 06.07.2017
comment
упс, извините за это: заголовок stackoverflow.com/questions/10339365/   -  person shotor    schedule 06.07.2017
comment
Я пытаюсь так, но у меня это не работает. Я добавляю код в вопрос на случай, если вы увидите что-то, чего я не вижу.   -  person Toni Michel Caubet    schedule 06.07.2017
comment
Я видел решение этого где-то на SO, в глубины мы погружаемся!   -  person    schedule 06.07.2017
comment
Возможный дубликат Как сместить центральную точку в API карт Google V3   -  person    schedule 06.07.2017


Ответы (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);
    });
}
person Toni Michel Caubet    schedule 20.07.2017