Google Maps Problema di altezza della finestra

Question

Ho cercato una soluzione in rete.

Il mio problema è che l'altezza della finestra informativa non viene calcolata correttamente. Non ci sono immagini lì dentro, quindi non è un problema con il caricamento dell'immagine in un secondo momento e la dimensione non è nota quando viene creata la bolla.

Anche se lo riempio con circa 15 righe in più di testo, le dimensioni stanno iniziando ad andare bene.

Questo è ciò che fornisco a infoWindowHtml:

<div><h2><a href="">Some title</a></h2><dl><dt>Location:</dt><dd>london</dd><dt>Description</dt><dd><p>Example text </p></dd></dl><p><a href="">Read more...</a></p></div>

Answer 1

Per risolvere questo problema puoi impostare larghezza e altezza del div principale. Se imposti solo la larghezza, funzionerà. Se imposti larghezza, altezza e overflow: auto, otterrai anche una barra di scorrimento in caso di contenuti troppo lunghi.

Tuttavia, in Google Maps V3 questo problema è stato risolto.

Answer 2

Ho avuto lo stesso problema, ma ho scoperto di avere questo problema perché ho impostato il padding su .contInfoBubble nel CSS e non nel parametro opzione. Quindi, rimuovo il padding dal CSS e lo imposto nel parametro quando creo il fumetto in html (non ancora .js ma map.html) , in questo modo:

[...]
var ib = new InfoBubble({
   //minHeight: 125,
   minWidth: 220,
   padding: 7,
   borderColor: "#dedede",
   borderRadius: 3,
   pixelOffset: new google.maps.Size(-140, -110),
});
[...]

E ho risolto il problema. Forse anche a te.

Answer 3

Aggiungi un altezza minima al tuo elemento di classe infoWindow.

Ciò risolverà il problema se le tue infoWindows hanno tutte le stesse dimensioni.

In caso contrario, aggiungere questa riga di jQuery alla funzione clic per la finestra informativa:

//remove overflow scrollbars
$('#myDiv').parent().css('overflow','');