Question

出于某种原因，我无法让Google地图将其弹出框的大小调整为正确的尺寸。相反，它把它放在一个带滚动条的小盒子里面。

我已将问题解决为http://petewilliams.info/stupidmap.html

的准系统示例

到目前为止，我尝试过Google搜索和尝试所有建议，但似乎没有任何效果。

任何想法都会感激不尽！

代码如下：

<!doctype html>
<head>
    <meta charset="utf-8">
    <style>
        #map div#pop {
        border:     1px solid red;
        height:        80px;
        width:         275px;
        }
    </style>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
    </script>
    <script type="text/javascript">

        function initialiseMap() {
            // Load MAP
            var latlng = new google.maps.LatLng(51.2367, -0.57177);
            var myOptions = {
                zoom: 13,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };

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

            var marker = new google.maps.Marker({
              position: new google.maps.LatLng(51.2367, -0.57177),
              map: map,
              title:'test item'
            });

            var infowindow = new google.maps.InfoWindow({
                content: "<div id=\"pop\">This is not 275x80px</div>",
                maxWidth: 325

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

    </script>
</head>
<body onload="initialiseMap();">

  <div id="map" style="width:580px; height:600px">Loading Map&hellip;</div>

</body>
</html>

由于

皮特

Answer 1

在Google Maps API计算infoWindow的大小后，似乎会应用该定义。当我从CSS声明中删除#map时，它的大小正确。

<style>
    div#pop {
    border:     1px solid red;
    height:     80px;
    width:      275px;
    }
</style>

Answer 2

对于可能在此阅读的其他人。 P标签接缝也搞乱了自动调整大小。我遵循了一堆这些指示，但没有任何帮助。我仍然有一个可滚动的div而不是一个更大的泡泡。将我的p标签更改为div标签（在div容器内）有帮助。

谷歌地图（V3）InfoWindow没有正确调整大小

2 个答案: