Google Map .InfoWindow Establecer alto y ancho

Question

¿Cómo se establece el tamaño y el ancho de un mapa de Google InfoWindow? Miré on the api page y solo encontré un método maxWidth.

Editar: He intentado algunas cosas. Hasta el momento ninguno de estos funciona:

var markerInfoWindow = new google.maps.InfoWindow({ 
     content: markerHTMLString, 
     maxHeight: 400, //Doesn't work 
     maxWidth: 400, //Doesn't work 
     width: 300,  //Doesn't work 
     height: 300  //Doesn't work 
    }); 

dicen también markerHTMLString es igual a este:

<div class = "MarkerPopUp"><div class = "MarkerContext">Text</div></div> 

He tratado de estas tres opciones, así (ninguno de ellos trabajaba)

1. .MarkerPopUp { 
       height: 300px; 
       width: 300px; 
   } 
   

2. .MarkerPopUp { 
       height: 300px; 
       width: 300px; 
   } 
   
   .MarkerContext { 
       height: 300px; 
       width: 300px; 
   } 
   

3. .MarkerContext { 
       height: 300px; 
       width: 300px; 
   } 
   

Esto también no funcionará:

document.getElementById('MarkerPopUp')parentNode.style.overflow = ''; 

o esta

document.getElementById('MarkerPopUp').parentNode.parentNode.style.overflow = ''; 

estoy más o menos pasando por todos los hilos que puedo encontrar y probar todo. Solo para limitar algunas cosas (aunque puede haber otro problema)

Answer 1

Puede ser que cuando el html pase a la API del mapa y se analice que no tiene acceso a las delcaraciones de la hoja de estilos. Intente agregar su ancho como estilo en línea en MarkerPopUp.

<div class = "MarkerPopUp" style="width: 300px;"><div class = "MarkerContext">Text</div></div> 

que sé, odio los estilos en línea también, pero podría resolver su problema en este caso.

Answer 2

.gm-style-iw{ 
    max-height: 10px; 
} 

Estilo de configuración para gm-style-iw hace el trabajo!

Answer 3

Try siguiente código:

infowindow = new google.maps.InfoWindow({ 
     content: "", 
     maxWidth: 200 , 
     maxHeight: 400 
    }); 

Answer 4

uso importante en css

.MarkerPopUp { 
    height: 300px !important; 
    width: 300px !important; 
} 

Answer 5

Puede utilizar envoltorio <div> y añadir estilo como este <div style='height: 40px; text-align: center'> y añadir código CSS .gm-style-iw { max-width: 400px!important;} en su archivo css;