2013-02-18 4 views
8

Я искал этот вопрос в течение некоторого времени, и все, что у меня есть, - головная боль. Я добавляю google-маркер с инфобоксами на мою карту google, но инфобокс расположен ниже маркера, и как бы я ни был благодарен за то, что он был над маркером. Кто-нибудь знает как это делать?google map infobox position

И, пожалуйста, не направляйте некоторые ссылки куда-нибудь, я видел это в течение всего времени. Заранее спасибо.

ответ

14

установить alignBottom -сообщение infoBox на true (по умолчанию false). Для дальнейших настроек позиции используйте pixelOffset -сообщение infoBox

+0

То, что я сейчас уже работает, как и ожидалось, инфобокс уже на верхней части маркера. У меня также есть div на самой верхней части карты, и в некоторых случаях инфобокс перекрывается им. Как мне настроить infobox таким образом, что когда инфобокс будет перекрываться div, он отрегулирует его положение, сделав его более низким, чем обычное положение? Заранее спасибо. –

4

По умолчанию infoBox укажет левую нижнюю часть маркера. Вы можете просто сделать это:

var ib= new InfoBox({ 
    ....//other properties, 
    pixelOffset: new google.maps.Size(-25, 0) //where your marker's height is 25px 
}); 
+3

Я думаю, что первое число - это 'x-offset' (width), а второе -' y -setset' (height). По крайней мере, это то, что я видел, когда добавлял это в мои настройки InfoBox – hellatan

2
infobox = new InfoBox({ 
     content: document.getElementById("infobox"), 
     disableAutoPan: false, 
     maxWidth: 150, 
     pixelOffset: new google.maps.Size(-140, -45), 
     zIndex: null, 
     boxStyle: { 
      background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/tipbox.gif') 0% 100% no-repeat", 
      opacity: 0.75, 
      width: "280px" 
     }, 
     infoBoxClearance: new google.maps.Size(1, 1), 
     alignBottom: true 
    }); 


#infobox { 
    border:2px solid black; 
    margin-bottom: 8px; 
    background:#333; 
    color:#FFF; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:12px; 
    padding: .5em 1em; 
    -webkit-border-radius: 2px; 
    -moz-border-radius: 2px; 
    border-radius: 2px; 
    text-shadow:0 -1px #000000; 
    -webkit-box-shadow: 0 0 8px #000; 
    box-shadow: 0 0 8px #000; 
} 

// загружаем настроенную стрелу из местного

Смежные вопросы