Question

我已经在googlemap中创建了一个信息窗口，信息窗口显示了我希望将其完全去除的侧面的空白，以便图像可以覆盖全宽，并且信息窗口关闭按钮可以位于图像上方以去除空白，我尝试了边距宽度填充没有任何效果。我在这里添加了代码，并添加了该问题的图片。预先谢谢你。

<!DOCTYPE html>
<html>

   <head>
      <script src = "https://maps.googleapis.com/maps/api/js"></script>

      <script>
         function loadMap() {

            var mapOptions = {
               center:new google.maps.LatLng(17.433053, 78.412172),
               zoom:5
            }

            var map = new google.maps.Map(document.getElementById("sample"),mapOptions);

            var marker = new google.maps.Marker({
               position: new google.maps.LatLng(17.433053, 78.412172),
               map: map,
               draggable:true,
               icon:'/scripts/img/logo-footer.png'
            });

            marker.setMap(map);

            var infowindow = new google.maps.InfoWindow({
               content:'<div class="google-map-info"><img src="https://pub-static.haozhaopian.net/static/web/site/features/backgrounds/images/01438c545ec45329ccdddb4cb88560ae6a.jpg" /></div>\
<div class="info-window-title">Hello World</div>'   
            });

            infowindow.open(map,marker);
         }
      </script>

   </head>

   <body onload = "loadMap()">
      <div id = "sample" style = "width:580px; height:400px;"></div>
   </body>
<style>
.gm-style-iw{width:100%;}
.google-map-info img {width:100%;height: 206px;
    overflow: hidden;}
</style>
</html>

谷歌地图信息窗口删除空格问题

0 个答案: