Centro de Google Maps (V3) en el cambio de tamaño del navegador (responsivo)

Tengo un Google Maps (V3) en mi página al 100% de ancho de página con un marcador en el medio. Cuando redimensiono el ancho de la ventana de mi navegador, me gustaría que el mapa se mantuviera centrado (responsivo). Ahora el mapa se queda en el lado izquierdo de la página y se hace más pequeño.

ACTUALIZAR Consiguió que funcionara exactamente como se describe gracias a Duncan. Este es el código final:

var center;
function calculateCenter() {
  center = map.getCenter();
}
google.maps.event.addDomListener(map, 'idle', function() {
  calculateCenter();
});
google.maps.event.addDomListener(window, 'resize', function() {
  map.setCenter(center);
});
Author: Gregory Bolkenstijn, 2012-01-09
Source

5 answers

Necesita tener un detector de eventos para cuando la ventana cambie de tamaño. Esto funcionó para mí (ponlo en tu función initialize):

google.maps.event.addDomListener(window, 'resize', function() {
    map.setCenter(center);
});
 142
Author: duncan,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-09-25 12:26:28

Detecta el evento de redimensionamiento del navegador, redimensiona el mapa de Google mientras conserva el punto central: 

var map = ...; // your map initialisation code

google.maps.event.addDomListener(window, "resize", function() {
    var center = map.getCenter();
    google.maps.event.trigger(map, "resize");
    map.setCenter(center); 
});

Puede usar el mismo código en otros controladores de eventos al cambiar el tamaño del mapa de Google a través de otros medios (por ejemplo, con un control 'redimensionable' de jQuery-UI).

Fuente: http://hsmoore.com/blog/keep-google-map-v3-centered-when-browser-is-resized/ crédito a @smftre para el enlace.

Nota: Este código fue enlazado en el comentario de @smftre sobre la respuesta aceptada. Me creo que vale la pena agregarlo como su propia respuesta, ya que es realmente superior a la respuesta aceptada. Elimina la necesidad de una variable global para rastrear el punto central y un controlador de eventos para actualizar esa variable.

 83
Author: William Denniss,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-23 12:10:32

Algunos buenos ejemplos sobre w3schools.com. Usé lo siguiente y funciona muy bien. 

google.maps.event.addDomListener(window, 'resize', function() {
  map.panTo(myLatlng);
});

Http://www.w3schools.com/googleapi/google_maps_events.asp

 4
Author: Steve Mulvihill,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-04-16 03:11:07

Html: Crea un div con un id de tu elección

<div id="map"></div>

Js: Crea un mapa y adjúntalo al div que acabas de crear

var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 16,
    center: new google.maps.LatLng(-33.890542, 151.274856)
});

Centrar cuando la ventana cambia de tamaño

var center = map.getCenter();

google.maps.event.addDomListener(window, 'resize', function() {
    map.setCenter(center);
});
 0
Author: drjorgepolanco,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-09-13 23:55:19

Actualizado de la solución anterior a es6.

let center;
const addMapListener = google.maps.event.addDomListener;

addMapListener(map, 'idle', () => center = map.getCenter());
addMapListener(window, 'resize', () => map.setCenter(center));
 0
Author: David Bradshaw,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-04-27 16:16:54