Как я изменяю размеры Google Map с JavaScript после того, как он загрузился?
По сути, вам нужно передать prop, которая возвращает значение, обновленное до вашего
import React, { Component } from 'react';
class Component2 extends Component {
componentDidMount() {
const { value, returnUpdatedValue } = this.props;
let updateValue = value + 100;
returnUpdatedValue(updateValue)
};
render() {
const { value } = this.props;
return (
{value}
);
}
}
export default Component2;3 ответа
Если вы используете Google Maps v2, вызовите checkResize () на вашей карте после изменения размера контейнер. ссылка
ОБНОВЛЕНИЕ
Google Maps JavaScript API v2 устарел в 2011 году. Он больше не доступен.
Вольфганг Пихлер map-in-a-box предлагает
загрузить карту в перетаскиваемом элементе div с изменяемым размером.
для Google Maps v3 вам нужно инициировать событие изменения размера по-другому:
google.maps.event.trigger(map, "resize");
См. Документацию по событию изменения размера (вам нужно будет найти слово «изменение размера»): http: // code .google.com / apis / maps / documentation / v3 / reference.html # event
Обновление
Этот ответ был здесь давно, поэтому небольшая демонстрация может оказаться полезной, и хотя он использует jQuery, реального нужно сделать так.
$ (function () {var mapOptions = {zoom: 8, center: new google.maps.LatLng (-34.397, 150.644)}; var map = new google.maps.Map ($ ("# map-canvas ") [0], mapOptions); // прослушиваем событие изменения размера окна и запускаем Google Maps для обновления $ (window) .resize (function () {// ('карта' здесь является результатом созданного ' var map = ... 'выше) google.maps.event.trigger (map, "resize");});}); html, body {height: 100%; } # карта-холст {минимальная ширина: 200 пикселей; ширина: 50%; минимальная высота: 200 пикселей; высота: 80%; граница: 1 пиксель сплошного синего цвета; } Демонстрация изменения размера Карт Google ОБНОВЛЕНИЕ 2018-05 -22
С новым выпуском средства визуализации в версии 3.32 Maps JavaScript API событие изменения размера больше не является частью класса Map .
В документации указано
При изменении размера карты центр карты фиксируется.
Полноэкранный элемент управления теперь сохраняет центр.
Больше нет необходимости запускать событие изменения размера вручную.
источник: https://developers.google.com / maps / documentation / javascript / new-renderer
google.maps.event.trigger (map, "resize"); не действует, начиная с версии 3.32