Question

我在显示GoogleMap时遇到问题。

以下是网站源代码：http://pastebin.com/LjhVbEF7

当我尝试运行此网站时，不会显示地图。 Firebug控制台说Uncaught TypeError: Cannot read property 'offsetWidth' of null

你知道我做错了什么吗？我知道网上有很多工作示例，但是这个代码是由一个特殊的脚本生成的，我无法干涉它。也许我忘了设置一些变量？

感谢，麦克

=================

修改这段代码只有在我将JS放在函数定义中并在body onload param中调用它时才有效。您是否知道如何在不使用此类函数和onload param的情况下使其工作？

Answer 1

我意识到这可能有点晚了 - 但希望它能够帮助其他人：

在您的情况下，初始化函数不会触发，但也可能是由于未在容器div上设置宽度和高度属性引起的。如果您不想简单地将load事件添加到body标记，则可以使用以下jQuery：

//Add onload to body
$(window).load(function(){
    initialize()
});

Answer 2

你可能在AngularJS工作吗？我是，并且这个问题一直持续到上述所有解决方案。原因是我找到我的地图div的部分没有及时完成，因此div为空，因此你得到了错误。

请参阅Angular在此处调用GoogleMaps的方式：

Initialize Google Map in AngularJS

Answer 3

这是因为您的脚本在加载DOM元素之前运行。一个简单的解决方案是将其放入一个函数中并在加载完成时触发它。请参阅以下问题：

Google MAP API Uncaught TypeError: Cannot read property 'offsetWidth' of null

Answer 4

大多数时候我收到此错误只是因为我在getElementById中引用的元素不在页面上或者我使用了错误的ID。显而易见的错误，但在深入研究更先进的解决方案之前，请务必仔细检查。

Answer 5

不确定，但可能是这一行

map_4e60b1f9c94ae.setCenter(new google.maps.LatLng(0, 0, 1));

我认为new google.maps.LatLng只有两个属性，纬度和经度。

从地图网站

尝试此位

var latlng = new google.maps.LatLng(-34.397, 150.644);

http://code.google.com/apis/maps/documentation/javascript/tutorial.html

Answer 6

尝试将JavaScript代码放入正文并在div id="map_canvas"

之后

这样的事情：

<body>
    <div id="map_canvas"></div>

    <script type="text/javascript">
        var map_4e60b1f9c94ae = new google.maps.Map(document.getElementById("map_canvas"), {"mapTypeId":"roadmap","zoom":10});
        map_4e60b1f9c94ae.setCenter(new google.maps.LatLng(0, 0, 1));
    </script>
</body>

GoogleMap的offsetWidth问题

6 个答案: