google.maps.InfoWindow sınıfı

Question

için domready etkinliğinin dinlenmesi Web sayfama google map eklemeyi deniyorum. Haritadaki bir işaretçiyi tıkladığınızda pop-up balonuna bir form eklemek istiyorum.

API belgeleri içeren infowindow içeriği DOM tutturulduğu zaman domready

"olayı dinamik olarak bilgi penceresi içeriği okullara yardımcı olmak durumunda. Bu etkinliğe izlemek isteyebilirsiniz ateş söylüyor ."

Bu olayı nasıl dinlerim?

Bu, documentation dur.

Answer 1

Sadece benzer bir sorunu kendim çözdüm. domready olayı dinlemek için aşağıdaki sözdizimini kullanın:

google.maps.event.addListener() olay 'domready' infowindow HTML yapısının oluşturulması için ve tanımlanmış infowindow açılmasından önce bekleyeceği

infoWindow = new google.maps.InfoWindow(); 
google.maps.event.addListener(infoWindow, 'domready', function() { 
     // whatever you want to do once the DOM is ready 
}); 

Answer 2

var contentString = 'your form here'; 

var infowindow = new google.maps.InfoWindow({ 
    content: contentString 
}); 

var marker = new google.maps.Marker({ 
    position: myLatlng, 
    map: map, 
    title:"My Form" 
}); 

google.maps.event.addListener(marker, 'click', function() { 
    infowindow.open(map,marker); 
}); 

Answer 3

stiller uygulanır.

bu örnekle çalıştık:

google.maps.event.addListener(infowindow, 'domready', function() { 

    // Reference to the DIV which receives the contents of the infowindow using jQuery 
    var iwOuter = $('.gm-style-iw'); 
    var iwBackground = iwOuter.prev(); 

    // Remove the background shadow DIV 
    iwBackground.children(':nth-child(2)').css({'display' : 'none'}); 

    // Remove the white background DIV 
    iwBackground.children(':nth-child(4)').css({'display' : 'none'}); 

}); 

Sonra

.gm-style-iw { 
    width: 350px !important; 
    top: 0 !important; 
    left: 0 !important; 
    background-color: #fff; 
    box-shadow: 0 1px 6px rgba(178, 178, 178, 0.6); 
    border: 1px solid rgba(72, 181, 233, 0.6); 
    border-radius: 2px 2px 0 0; 
} 

Sonuç:

Referans: http://en.marnoto.com/2014/09/5-formas-de-personalizar-infowindow.html

Teşekkür