He encontrado un problema con Google Maps.

Tengo un formulario HTML que muestra una gran cantidad de datos para un usuario. El formulario se divide en un diseño de acordeón, y cada acordeón es responsable de mostrar diferentes aspectos de los datos del usuario.

Una de estas concertinas contiene la dirección del usuario y un mapa de Google con varios pines que representan información pertinente.

Si el formulario está cargado y la concertina está cerrada, entonces el mapa de Google <div> no tiene una altura vertical sobre la cual calcular la configuración del zoom y termino con un mapa que está ampliado hasta la extensión del planeta. Si la concertina está abierta cuando se carga el formulario, el zoom funciona bien (porque el mapa <div> tiene altura).

Esta es una característica/error bien conocido. Una forma de evitar esto es cargar el mapa de Google cuando el usuario abre la concertina o si la concertina está abierta cuando se carga el formulario.

Lo que necesito lograr: necesito evitar múltiples llamadas a Google Maps para 'recargar' el mapa si el usuario abre y cierra la concertina varias veces (sin actualizar el formulario).

Aquí hay un violín: https://jsfiddle.net/fdnuopzv/4/

Como puede ver, el mapa de Google se carga CADA vez que se abre la concertina. Necesito detectar que el mapa existe para que muestre el mapa existente en lugar de buscar uno nuevo.

Intenté usar:

 if (!google.map) { map_init(); }

pero esto no tiene el efecto deseado.

Como punto de interés, si mueve la línea map_init() de la línea 10 a la línea 65, puede ver cómo una altura cero rompe el zoom de Google.