Google maps 将信息框与谷歌地图中的标记对齐
我正在使用InfoBox插件,我有以下代码:Google maps 将信息框与谷歌地图中的标记对齐,google-maps,gmaps4rails,marker,infowindow,Google Maps,Gmaps4rails,Marker,Infowindow,我正在使用InfoBox插件,我有以下代码: Gmaps.map.infobox = function(boxText) { return { content: boxText ,disableAutoPan: false ,maxWidth: 0 ,pixelOffset: new google.maps.Size(-140, 0) ,zIndex: null ,boxStyle: { background: "url('htt
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
}};
对于尺寸为77x80像素的标记,当显示信息窗口时,它会在标记底部正确对齐,如下所示:
但是,如果我将标记的大小更改为35x44 px,则InfoWindow在标记底部没有完全对齐,如您在此处所见:
关于如何使其在底部完全对齐,有什么想法吗
编辑:对于小标记,我在使用gmaps4rails的库中设置了以下内容:
marker.picture({
:picture => "assets/juice-pin-small.png",
:width => 35,
:height => 44,
})
对于大标记,我通过设置以下内容来创建它们:
marker.picture({
:picture => "assets/juice-pin-small.png",
:width => 70,
:height => 88,
:marker_anchor => [23,78]
})
我所知道的绝对不是最好的解决方案,因为如果要同时使用两种大小的标记,则需要两组选项 无论如何,可以使用pixelOffset更改信息框的位置:new google.maps.Size-140,0;,在您的情况下,要向左移动方框,请将第一个数字设置为负数,如-145
想想别的办法:编辑标记本身并将其移动几个像素。您能否同时添加两个标记的完整定义,而不仅仅是提及大小?你是如何将信息框添加到地图的?你所说的完整定义是什么意思?我用库中设置的内容进行了编辑…我添加了信息框,在库生成地图后,在标签之间添加我在问题中所说的内容。因为如果信息框用类似infobox.openmap的内容连接到标记上,则标记;这取决于标记定义。如果它的锚是错误的,那么它也可能不在正确的位置。