Question

我正在尝试将图像添加到我的自定义信息框（请注意，这不是infoWindow）。脚本运行正常并正确加载，直到我将'img src'行添加到infoBox的HTML内容中。从这一点来说，没有任何负载。我一直想弄明白，在网上找不到任何东西，我发现的一切都与infoWindows有关。

代码段：

 var marker_C = new google.maps.Marker({
         map: map,
         draggable: true,
         position: myCenter,
         visible: true
        });

        var boxText = document.createElement("div");
        boxText.style.cssText = "border: 1px solid black; margin-top: 8px; background: #f5c82f; padding: 5px;"; 
        boxText.innerHTML = "<strong>Taylor's House</strong>, Tallanasty<br><img border="0" src="/images/bar.jpg" alt="BAR" width="304" height="228"><br>The text for whats going on here<br>My Address Here";

        var myOptions = {
                 content: boxText,
                disableAutoPan: false,
                maxWidth: 0,
                pixelOffset: new google.maps.Size(-180, 0),//X axis should be half the size of box width
                zIndex: null,
                boxStyle: { 
                  background: "url('tipbox.gif') no-repeat",
                  opacity: 0.85,
                  width: "360px"
                 },
                closeBoxMargin: "10px 2px 2px 2px",
                closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif",
                infoBoxClearance: new google.maps.Size(10, 10),
                isHidden: false,
                pane: "floatPane",
                enableEventPropagation: false
        };

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

如果我将'boxText.innerHTML'设置为："Taylor's House, Tallanasty The text for whats going on here My Address Here"; 没有图像，一切都很好。

希望有经验的人可以指出我正确的方向。

Answer 1

您需要转义innerHTML字符串中的双引号：

boxText.innerHTML = "<strong>Taylor's House</strong>, Tallanasty<br><img border=\"0\" src=\"/images/bar.jpg\" alt=\"BAR\" width=\"304\" height=\"228\"><br>The text for whats going on here<br>My Address Here";

否则会出错。

在Google Maps API v3中向InfoBox添加图像

1 个答案: