0

这是我的谷歌地图代码,用于创建标记的信息窗口并将其宽度限制为 200 像素。一切正常:

                    google.maps.event.addListener(marker, 'click', function () {
                    infowindow.setContent(this.html);
                    infowindow.setOptions({maxWidth:200}); 
                    infowindow.open(map, this);
                    });

现在我需要向 infow 窗口添加一个类,以便我可以使用 CSS 设置它的样式。从谷歌地图文档看来,boxClass 是我需要的,但以下内容没有添加该类。我有语法错误吗?

                    google.maps.event.addListener(marker, 'click', function () {
                    infowindow.setContent(this.html);
                    infowindow.setOptions({boxClass:'myGoogleClass'});
                    infowindow.open(map, this);
                    });
4

1 回答 1

0

您不能将 infowindow 与 boxClass 一起使用。您必须改用 infoBox 组件。如果您将信息窗口更改为信息框,它将正常工作。

 var marker = new google.maps.Marker({
         map: theMap,
         draggable: true,
         position: new google.maps.LatLng(49.47216, -123.76307),
         visible: true
        });

        var boxText = document.createElement("div");
        boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: yellow; padding: 5px;";
        boxText.innerHTML = "City Hall, Sechelt<br>British Columbia<br>Canada";

        var myOptions = {
                 content: boxText
                ,disableAutoPan: false
                ,maxWidth: 0
                ,pixelOffset: new google.maps.Size(-140, 0)
                ,zIndex: null
                ,boxStyle: { 
                  background: "url('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
        };

        var ib = new InfoBox(myOptions);
        ib.open(theMap, marker);

以上代码取自这里

使用 infowindow 时唯一可以设置样式的是内容,而不是窗口本身

于 2013-05-22T11:32:05.087 回答