Javascript 如何更改谷歌地图信息窗口关闭按钮的位置？

我读了好几篇文章，为此浪费了很多时间。 我的javascript如下所示。我已经使用了closeBoxMargin属性，但它不起作用

function addBasicInfoWindow(map, marker, contentStr) {
    var infoBoxOptions = {
            content: contentStr,
            pixelOffset: new google.maps.Size(0, 15),
            disableAutoPan: false,
            closeBoxMargin: "10px 0px 2px 2px",
            closeBoxURL: "http://localhost:8080/DummyMap/images/mapClose.png",
            infoBoxClearance: new google.maps.Size(1, 1),
            enableEventPropagation: false,
        };
    //alert(infoBox.innerHTML);
    try {
        var infowindow = new google.maps.InfoWindow(infoBoxOptions);

        infowindow.open(map,marker);
    } catch (ex) {
        alert(ex);
    }
}

我参考过，但没有什么对我有用

---

提前为您提供一个有利的解决方案

问题似乎不在于如何更改关闭按钮的位置，而在于如何打开

InfoBox

。您正在使用

InfoBox

的选项调用

InfoWindow

构造函数，但您必须使用正确的选项创建

InfoBox

安排时间：

函数addBasicInfo窗口（映射、标记、内容str）{
var-boxText=document.createElement（“div”）；
boxText.style.cssText=“边框：1px纯黑色；页边距顶部：8px；背景：黄色；填充：5px；”；
boxText.innerHTML=“加拿大不列颠哥伦比亚省第二市政厅”；
变量myOptions={
内容：boxText，
disableAutoPan:错，
最大宽度：0，
pixelOffset:new google.maps.Size（-140,0），
zIndex:null，
boxStyle:{
背景：“url（'http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/tipbox.gif“）不重复”，
不透明度：0.75，
宽度：“280px”
},
closeBoxMargin：“10px 20px 2px 2px”，
closeBoxURL:“http://www.google.com/intl/en_us/mapfiles/close.gif",
infoBoxClearance:new google.maps.Size（1,1），
伊希登：错，
窗格：“浮动窗格”，
enableEventPropagation:false
};
google.maps.event.addListener（标记“单击”，函数（e）{
ib.open（map，this）；
});
var ib=新信息框（myOptions）；
ib.open（地图、标记）；
}

---

见完整

closeBoxMargin

设置为“10px 20px 2px 2px”，因此CloseBox右边应该有20px的边距。

花了一段时间，但我最终发现，下面的代码需要为您自己的谷歌地图标签id进行修改

下面的代码覆盖了一个透明的gif，该gif是一个点击区域，带有您选择的图像，并且位于正确的位置-您需要使用

right

和

top

来正确地显示

信息窗口

#MyGoogleMapTag > div > div > div:nth-child(1) > div:nth-child(4) > div:nth-child(4) > div > img {
    right: 45px !important;
    top: 7px !important;
    background-image:url("http://appsavvy.net/close.png") !important;
}

---

到目前为止，你能用你已经尝试过的东西做一把小提琴吗？

#MyGoogleMapTag > div > div > div:nth-child(1) > div:nth-child(4) > div:nth-child(4) > div > img {
    right: 45px !important;
    top: 7px !important;
    background-image:url("http://appsavvy.net/close.png") !important;
}