Un style Google Maps InfoWindow

Question

Quelqu'un a un peu de chance dénommant l’infowindow Google Maps ? Il se détraque partout. Le CSS est limité. Quelqu'un peut-il me montrer un exemple de code ?

Merci.

Answer 1

Google a écrit un peu de code pour m'aider avec ceci. Voici un exemple: Exemple

Voici d'autres style de marqueur exemples: De style marqueur exemples

Et un autre: La fenêtre d'information personnalisée

Answer 2

Vous pouvez modifier l'ensemble de l'InfoWindow à l'aide de jquery seul...

var popup = new google.maps.InfoWindow({
    content:'<p id="hook">Hello World!</p>'
});

Ici, l'élément <p> va agir comme un crochet dans la InfoWindow. Une fois le domready incendies, l'élément devient actif et accessible à l'aide de javascript/jquery, comme $('#hook').parent().parent().parent().parent().

Le code ci-dessous juste définit une bordure de 2 pixels autour de l'InfoWindow.

google.maps.event.addListener(popup, 'domready', function() {
    var l = $('#hook').parent().parent().parent().siblings();
    for (var i = 0; i < l.length; i++) {
        if($(l[i]).css('z-index') == 'auto') {
            $(l[i]).css('border-radius', '16px 16px 16px 16px');
            $(l[i]).css('border', '2px solid red');
        }
    }
});

Vous ne pouvez rien faire, comme l'implantation d'une nouvelle classe CSS ou tout simplement l'ajout d'un nouvel élément.

Jouer avec les éléments pour obtenir ce dont vous avez besoin...

Answer 3

J’ai utilisé le code suivant pour appliquer une feuille de style externe :

Answer 4

Vous pouvez utiliser la classe css trop.

Bonne journée !