我创建了带有自定义.gif图像的地图来代替标记。然后创建了一个信息框,该信息框必须与图像保持一定距离。将有几个图像,每个图像都有一个信息框。我想要做的是在信息框中添加一条线到图像,这样当屏幕变得杂乱时,很明显哪些信息框是图像的信息框。 在两个lat / lng点之间绘制的线是不好的,因为信息框以像素显示,而不是lat / lng,并且这样的线与信息框无关,因此不会像信息框那样隐藏/可见。 这可能吗? 我使用infobox.js 这是我的信息框代码。
infobox = new InfoBox({
content: document.getElementById("infobox1"),
disableAutoPan: false,
maxWidth: 200,
pixelOffset: new google.maps.Size(-140, -150),
zIndex: null,
boxStyle: {
width: "150px"
},
closeBoxMargin: "12px 4px 2px 2px",
closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif",
infoBoxClearance: new google.maps.Size(1, 1)
});
infobox.open(map, marker);
代码有效。我展示它以防止它与我想做的事情有关。
这是我的div。
<div id='infobox-wrapper'>
<div id='infobox1'> this is text text</div>
</div>
使用此css找到解决方案
.infoBox:before{
content : " ";
width: 0;
height: 0;
border-left: 1px solid transparent;
border-right: 1px solid transparent;
border-bottom: 70px solid #000;
position:absolute;
top:-80px;
left:130px;
}