Gmaps4Rails Custom InfoWindow

Question

Je fais gmaps4rails travailler sur mon projet, mais j'ai du mal à personnaliser l'aspect de la fenêtre d'information. J'ai suivi le tutoriel trouvé dans le wiki et je comprends la plupart de celui-ci, sauf la partie de rappel pour l'InfoBox qui est un peu confus pour moi, un programmeur JS inexpérimenté. Quand je clique sur le marqueur je reçois seulement le bouton 'x' (fermer) mais aucun texte n'est affiché ou couleur comme prévu. Voici mon code:

En post.rb:

def gmaps4rails_infowindow 
    # add here whatever html content you desire, it will be displayed when users clicks on the marker 
    "<h4>#{self.title}</h4>" 
end 

En posts.js.coffee:

Gmaps.map.infobox = (boxText) -> 
    content: boxText 
    disableAutoPan: false 
    maxWidth: 0 
    pixelOffset: new google.maps.Size(-140, 0) 
    zIndex: null 
    boxStyle: 
    background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.5/examples/tipbox.gif') no-repeat" 
    opacity: 0.75 
    width: "280px" 

    closeBoxMargin: "10px 2px 2px 2px" 
    closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif" 
    infoBoxClearance: new google.maps.Size(1, 1) 
    isHidden: false 
    pane: "floatPane" 
    enableEventPropagation: false 

Dans gmaps4rails.css

.yellow { border: 1px solid black; margin-top: 8px; background: yellow; padding: 5px; } 

À mon avis:

= gmaps("markers" => {"data" => @json, "options" => {"custom_infowindow_class" => "yellow" } }) 

J'apprécierais vraiment que quelqu'un puisse me diriger dans la bonne direction car c'est la première fois que je travaille avec des cartes. Merci d'avance!

EDIT:

Mes Résultats:

http://postimage.org/image/45feoz3kl/

EDIT 2:

Je ne veux pas abuser de vous, mais une fois que je comprends ce qui se passe je serai bien par mon propre, pour l'instant c'est juste le pire. Maintenant, il ne rend même pas et je reçois un tas d'erreurs. Ceci est mon code:

= gmaps("markers" => {"data" => @json, "options" => {"custom_infowindow_class" => "yellow" } }) 
- content_for :scripts 
    :javascript 
    Gmaps.map.infobox = function(boxText) { 
     return { 
     content: boxText 
     ,disableAutoPan: false 
     ,maxWidth: 0 
     ,pixelOffset: new google.maps.Size(-140, 0) 
     ,zIndex: null 
     ,boxStyle: { 
      background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.5/examples/tipbox.gif') no-repeat" 
      ,opacity: 0.75 
      ,width: "280px" 
      } 
     ,closeBoxMargin: "10px 2px 2px 2px" 
     ,closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif" 
     ,infoBoxClearance: new google.maps.Size(1, 1) 
     ,isHidden: false 
     ,pane: "floatPane" 
     ,enableEventPropagation: false 
    }}; 

Erreur:

"keyword_ensure inattendu, en attendant la fin $" dans la ligne de la déclaration de retour.

Answer 1

Après quelques commentaires, je comprends enfin (même il était évident après tout ...):

Gmaps.map est créé à la volée lorsque la page est chargée. Donc, chaque fois que vous voulez ajouter des propriétés à cet objet, vous devez l'ajouter après l'appel gmapset dans un content_for :scripts.

dans votre code:

= gmaps() 

- content_for :scripts do 
    :javascript 
    Gmaps.map.infobox = function(....