Окно оформления в Google Maps 4 rails

Я пытаюсь избавиться от полосы прокрутки, которая появляется в информационных окнах на моей карте, но я не вижу, к какому элементу следует применить стиль.

К какому элементу следует применять стили при рендеринге карт с помощью рельсов Google Maps 4? Я знаю, что это div, но определенного класса или селектора нет, и поэтому я не могу выбрать окна.

Я визуализирую свое окно из партиала следующим образом:

marker.infowindow render_to_string(:partial => 'window_info', :locals => {:place => place})

ruby-on-rails google-maps ruby-on-rails-3 gmaps4rails
person Hommer Smith    schedule 29.04.2012    source источник
comment
gmaps4rails не добавляет дополнительный div к html, который вы помещаете в свое информационное окно. Так что здесь нет ничего особенного для драгоценного камня   -  person apneadiving    schedule 30.04.2012
comment
в частичном window_info у меня есть ‹div class = 'map_window'›, и я вижу это, когда проверяю элемент. Однако этот div находится внутри двух других div, откуда я не знаю, и это те, которые, как мне кажется, мне нужно стилизовать, чтобы избавиться от полосы прокрутки.   -  person Hommer Smith    schedule 30.04.2012

Ответы (3)


arrow_upward
0
arrow_downward

В соответствии с Стили InfoWindow Карт Google , я думаю, вы не можете оформить информационное окно так, как хотите. Вам придется использовать InfoBox, который я построил в драгоценном камне.

См. здесь, раздел Custom infowindows.

person apneadiving    schedule 30.04.2012
comment
Спасибо за ответ. Когда я пытаюсь отобразить карты с помощью gmaps вместо gmaps4rails, маркеры там не отображаются. Что делает невозможным проверить, работает ли стиль. Есть ли разница в объявлении gmaps или gmaps4rails? - person Hommer Smith; 01.05.2012
comment
Смотрите документ, там все описано - person apneadiving; 01.05.2012

arrow_upward
0
arrow_downward

Вам нужно указать ему использовать определенный класс, вот как я это делаю в своем приложении:

<%= gmaps({"markers" => 
            {"data" => @json , 
             "options" => {"custom_infowindow_class" => "infobox", 
             "auto_adjust"=>false, "do_clustering"=>true}}} ) %>

Я думаю, вам просто нужно, как понять, как пройти

"options" => {"custom_infowindow_class" => "whatever" }

В инициализацию вашей карты

Затем вы можете создать класс css и применить свой собственный стиль.

.whatever { 
  #whatever
}
person RadBrad    schedule 29.04.2012
comment
Я использую gmaps4rails для создания карты, и то, что вы предложили, не работает... - person Hommer Smith; 30.04.2012
comment
Можете ли вы понять, как передать параметры => {custom_infowindow_class => что угодно} в инициализацию gmaps? - person RadBrad; 30.04.2012
comment
Я попытался посмотреть github.com/apneadiving/Google-Maps-for-Rails, но я не могу его найти. Я сделал это еще до того, как задал этот вопрос... В основном поэтому я и спросил :( - person Hommer Smith; 30.04.2012

arrow_upward
0
arrow_downward

При проверке консоли js в chrome возникла ошибка: Объект № ‹ Маркер > не имеет метода 'infobox'. Это подсказка.

Согласно документам в Пользовательских информационных окнах, шаг 2, мы должны инициализировать код js, но у меня это не сработало.

Затем загляните внутрь драгоценного камня в main.coffee

    infobox:            -> false   #to let user use custom infoboxes

Установка в true не сработала

Хитрость для меня заключалась в том, чтобы изменить эту строку

@infowindow = new InfoBox(@infobox(boxText))

в приложении/активы/javascripts/gmaps4rails/google/objects/marker.coffee

К коду, указанному в docs.

    @infowindow = new InfoBox(
      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        

    )
person Erick Eduardo Garcia    schedule 11.04.2014