javascript - Google Maps 如何将图像添加到 InfoWindow

标签 javascript html image google-maps infowindow

您好,我正在尝试将图像添加到 google maps infoWindow 中,我的代码就像这样一个脚本

 var ContactUs = function () {

return {
    //main function to initiate the module
    init: function () {
        var map;
        $(document).ready(function(){
          map = new GMaps({
            div: '#map',
            lat: -13.004333,
            lng: -38.494333,
          });
           var marker = map.addMarker({
                lat: -13.004333,
                lng: -38.494333,
                title: 'Loop, Inc.',
                infoWindow: {
                    content: "<b>Loop, Inc.</b> 795 Park Ave, Suite 120<br>San Francisco, CA 94107"
                }
            });

           marker.infoWindow.open(map, marker);
        });
    }
};

 }();

然后在我的 HTML 中它被这样调用:

  <div class="row-fluid">
     <div id="map" class="gmaps margin-bottom-40" style="height:400px;"></div>
 </div>

我尝试将图像标签添加到脚本文件中,但它不起作用,我知道我必须在 html 文件中添加一些代码,但不确定是什么?

最佳答案

您添加 HTML 以引用信息窗口“内容”中的图像

       var marker = map.addMarker({
            lat: -13.004333,
            lng: -38.494333,
            title: 'Loop, Inc.',
            infoWindow: {
                content: "<b>Loop, Inc.</b> 795 Park Ave, Suite 120<br>San Francisco, CA 94107<br><img src='myimage.jpg' alt='image in infowindow'>"
            }
        });

以上假定本地目录中的图像“myimage.jpg”。您也可以使用绝对 URL。小心混用 "(双引号)和 '(单引号)。

关于javascript - Google Maps 如何将图像添加到 InfoWindow,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18333671/

相关文章:

ios - 将 native 图像 react 为未找到字符串

javascript - HTML 表单验证数字

css - 如何为通过 Razor 添加的每个图像添加文本叠加?

javascript - React Component 有条件地渲染子项不能按我希望的那样工作

javascript - 在文本区域中输入时禁用 javascript 功能

html - 两个 div 彼此相邻,其中一个是包含 100% 宽度表格的流体

html - 无法使下拉意味着

html - CSS 背景图片不会显示 - 同一文件夹中的图片

javascript - 如何匹配变量对

javascript - 如何将对象的属性作为本地属性传递给 Jade 中的包含项?