javascript 谷歌地图信息框位置
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14938939/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
google map infobox position
提问by Ivan
I've been googling that question for some time and all I got is headache. I add google marker with infobox on my google map, but the infobox is located lower than marker, how ever I would really appreciate it to be over the marker. Does anyone know how to do it?
我一直在谷歌上搜索这个问题一段时间,但我所得到的只是头疼。我在我的谷歌地图上添加了带有信息框的谷歌标记,但信息框的位置低于标记,我真的很感激它超过标记。有谁知道怎么做?
And please don't gove some links to somewhere, I was seeing it for a loooong time today. Thank you in advance.
并且请不要将某些链接指向某个地方,我今天已经看了很长时间了。先感谢您。
回答by Dr.Molle
set the alignBottom
-property of the infoBox to true
(default is false
). For further adjustments of the position use the pixelOffset
-property of the infoBox
将alignBottom
infoBox的-property设置为true
(默认为false
)。要进一步调整位置,请使用pixelOffset
infoBox的-property
回答by Carlos Martinez T
By default the infoBox will point the bottom left of the marker. You can simply do this:
默认情况下,信息框将指向标记的左下角。你可以简单地这样做:
var ib= new InfoBox({
....//other properties,
pixelOffset: new google.maps.Size(-25, 0) //where your marker's height is 25px
});
回答by Nagarjuna
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;
}
// Load the customized arrow from local
// 从本地加载自定义箭头