google-maps - 谷歌地图 v3 问题

Question

我有下面的代码，但是谷歌地图没有完全显示（只有左上角）。请参阅此屏幕截图。有人可以帮忙吗？提前致谢。

<script type="text/javascript">
        function initialize() {
            var latlng = new google.maps.LatLng(<?php echo $hotel->hotel_latitude.','.$hotel->hotel_longtitude; ?>);

            var Options = {
                center:latlng,
                zoom:15,
                mapTypeId:google.maps.MapTypeId.ROADMAP
            };

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

            marker = new google.maps.Marker({
                position:latlng,
                animation:google.maps.Animation.BOUNCE
            });

            marker.setMap(map);
        }

        google.maps.event.addDomListener(window, 'load', initialize);
    </script>

Answer 1

在我的一个项目中，我使用了谷歌地图 v3，但问题通过替换http://*而不是https://*. 所以试试这个。

Answer 2

调用 setMap 后，尝试google.maps.event.trigger(map, 'resize');

Answer 3

将宽度和高度添加到您的 div，然后它会正常工作。

<div id="imgFrame" style="width: 800px; height: 900px"></div>