-1

我正在尝试使用 Google Map API (V3) 在地图上放置图钉。我可以放置图钉并打开一个信息框。不幸的是，信息框不会显示 HTML 内容，只会显示一个字符串。我正在使用以下代码来创建/显示我的 pin/info 框。

addMarker('1600 Pennsylvania Avenue, Washington DC');

function addMarker(address) {
    var geocoder = new google.maps.Geocoder();

    geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });

            var boxText = document.createElement("div");
            boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: yellow; padding: 5px;";
            boxText.innerHTML = "Hello World!";

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

            google.maps.event.addListener(marker, 'click', function(){
                if( ib.anchor === this ){
                    ib.close();
                }
                else {
                    ib.open(map, this);
                }
            });

        }
    });
}

执行此操作时，信息框内容始终是[object HTMLDivElement]，我无法弄清楚如何让它正确显示boxText. 信息框的代码几乎 100% 直接取自 Google 自己的示例。

4

1 回答 1

1

所以，答案非常简单。使用最新版本的 infobox.js，它可以正常工作。

于 2014-02-05T15:52:25.023 回答