2013-02-18 232 views
8

我一直在谷歌搜索這個問題一段時間,我得到的只是頭痛。我在谷歌地圖上添加了帶有信息框的谷歌標記,但信息框位於比標記更低的位置,如何才能真正感謝它在標記上。有誰知道該怎麼做?谷歌地圖信息框位置

請不要在某處插入一些鏈接,我今天看到它很懶。先謝謝你。

回答

14

將infoBox的屬性alignBottom設置爲true(默認爲false)。要進一步調整頭寸,請使用信息框的pixelOffset - 屬性

+0

加載定製箭頭我已經把現在已經按預期工作,信息框已經在標記的頂部。我在地圖的最上面也有一個div,在某些情況下,信息框會被它覆蓋。我將如何調整信息框,以便當信息框與div重疊時,它會調整它的位置,使其低於通常的位置?提前致謝。 – 2013-06-27 18:33:56

4

默認情況下,信息框將指向標記的左下角。你可以簡單地這樣做:

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

我認爲第一個數字是'x-offset'(寬度),第二個數字是'y-ofset'(高度)。至少這就是我將它添加到我的InfoBox設置時所看到的 – hellatan 2013-11-04 13:54:43

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; 
} 

//從本地