Сосредоточьте карту Google V3 на маршруте после прохождения направления - PullRequest
13 голосов
/ 20 марта 2011

У меня карта V3 загружается и центрируется на определенной долготе / широте по умолчанию.После загрузки пользователь может ввести свой адрес, чтобы проложить маршрут к этой точке.Когда это происходит, размер карты изменяется, чтобы вместить поле с указаниями слева от него.Из-за этого маршрут не в центре в окне карты.Я попробовал следующий код, который, по моему мнению, должен работать логически, но безрезультатно.

Новая реализация: Если я каким-либо образом изменю размер окна, оно начнет работать, как и ожидалось.

Обнаружена проблема: Мне нужно было вызвать google.maps.event.trigger(map, 'resize') после изменения размера контейнера карты.

directionsService.route(query, function(result,status) {
    if (status === google.maps.DirectionsStatus.OK) {
        // This sets the directions container to display:block and resizes the map
        document.getElementById('map-container').className = "directions";
        directions.setDirections(result);
        var bounds = result.routes[0].bounds;
        map.fitBounds(bounds);
        map.setCenter(bounds.getCenter());
    } else {
        alert("");
    }
});

ОБНОВЛЕНИЕ 2018-05-22

С новой версией средства визуализации в JavaScript API Google Maps для версии 3.32 событие изменения размера больше не является частью Map class.

Документация гласит

При изменении размера карты центр карты фиксируется

  • Полноэкранное управление теперьсохраняет центр.

  • Больше нет необходимости запускать событие изменения размера вручную.

source: https://developers.google.com/maps/documentation/javascript/new-renderer

google.maps.event.trigger(map, "resize"); не имеет никакого эффекта, начиная с версии 3.32

1 Ответ

1 голос
/ 13 марта 2012

Вы уже нашли ответ, который я собирался сказать. Событие resize очень важно, чтобы получить правильные значения при каждом изменении контейнера карты (или, возможно, его родителя). В моем случае я переключался между двумя вкладками (карта и направления движения). Сначала карта будет правильно отображаться на вкладке карты, но переключение на направления и возвращение к карте приведет к появлению фанка.

Если ваша карта показывает только маленькую плитку в одном углу (в верхнем левом углу в моем случае) с остальными пустыми шансами, вам нужно запустить триггер изменения размера.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...